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ASP.NET 是 Microsoft 公司 推出 的 基于 .NET Framework 的 Web 应 用 开发 平台 , 是 Web 
应 用 开发 的 主流 技术 之 一 ， 它 带 给 人 们 的 是 全 新 的 技术 ， 和 由 此 产生 的 开发 效率 的 提高 ， 
网 站 性 能 的 提升 。 使 用 ASP.NET 进行 Web 应 用 开发 ， 程 序 结构 更 加 清晰 ， 开 发 流程 更 加 
简单 ， 从 而 可 以 提高 开发 效率 ， 缩 短 开发 周期 。ASP.NET 4.0 是 在 ASP.NET 3.5 的 基础 之 
上 构建 的 ， 保 留 了 其 中 很 多 令 人 喜爱 的 功能 ， 并 增加 了 一 些 其 他 领域 的 新 功能 和 工具 。 

进行 ASP.NET 开发 可 以 使 用 Visual Basic.NET 或 者 C#， 这 两 种 语言 都 是 .NET 环境 下 
的 程序 设计 语言 ,但 并 不 是 必须 使 用 .NET 集成 开发 环境 才能 进行 ASP.NET Web 程序 设计 。 
从 理论 上 讲 ， 用 记事 本 或 其 他 文本 编辑 器 就 可 以 编写 ASP.NET Web 应 用 程序 ， 但 大 多 数 
开发 人 员 还 是 希望 安装 Microsoft Visual Web Developer 2010(VWD)。VWD 是 专门 为 构建 
ASP.NET Web 站 点 而 开发 的 ， 其 中 包含 了 大 量 有 助 于 快速 创建 复杂 ASP.NET Web 应 用 程 
序 的 工具 。 为 了 使 广大 学 生 和 网 站 开发 技术 人 员 尽 快 掌握 ASP.NET 4.0 以 及 VWD 2010 的 
使 用 技巧 和 新 增 功能 ， 本 人 在 多 年 教学 经 验 与 科研 成 果 的 基础 上 编写 了 此 书 。 本 书 全 面 翔 
实地 介绍 了 ASP.NET 动态 网 站 开发 的 基本 流程 和 使 用 方法 ， 可 以 使 读者 快速 、 全 面 地 掌 
握 使 用 VWD 2010 快速 开发 ASP.NET Web 应 用 程序 ， 并 达到 融会 贯通 ， 灵 活 应 用 之 目的 。 

概括 起 来 ， 本 书 具 有 以 下 主要 特点 。 

(1) 结构 清晰 、 内 容 翔 实 。 在 每 一 章 的 开始 概要 说 明了 本 章 将 介绍 的 内 容 ， 使 学 习 者 
做 到 心中 有 数 ; 介绍 每 一 个 内 置 对 象 或 服务 器 控件 时 , 首先 介绍 该 对 象 或 控件 的 常用 属性 、 
方法 和 事件 ， 然 后 介绍 具体 的 应 用 场景 和 注意 事项 ， 且 在 介绍 过 程 中 都 配 有 插图 和 实例 说 
明 ; 在 每 章 的 最 后 还 有 对 应 的 本 章 小 结 ， 总 结 本 章 介 绍 的 内 容 ， 前 后 呼应 ， 系 统 性 强 。 

(2) 按照 动态 网 站 的 开发 流程 ， 从 网 站 基础 知识 讲 起 ， 循 序 渐进 地 介绍 了 ASP.NET 动 
态 网 站 开发 涉及 到 的 各 种 知识 和 技巧 ， 并 在 各 章 配 有 精心 选择 的 应 用 实例 ， 这 些 实例 既 有 
较 强 的 代表 性 和 实用 性 ， 又 能 够 综合 应 用 对 应 章节 介绍 的 知识 ， 使 学 习 者 能 够 全 方位 地 理 
解 所 学 内 容 ， 融 会 贯通 章节 之 间 的 联系 ， 达 到 举一反三 之 目的 。 

(3) 每 一 章 最 后 都 配 有 习题 。 这 些 习 题 紧 扣 该 章 介绍 的 内 容 。 通 过 回答 和 练习 这 些 习 
题 ， 有 助 于 读者 更 好 地 掌握 本 章 所 学 知识 ， 提 高 和 拓宽 读者 的 实际 技能 。 

全 书 共 分 12 章 ,第 1 章 介绍 了 网 站 建设 的 基础 知识 .ASP.NET 的 发 展 过 程 VWD 2010 
开发 环境 ， 以 及 ASP.NET 的 工作 原理 ; 第 2 章 介 绍 了 ASP.NET 的 页 面 框架 和 页 面 类 ， 
ASP.NET 的 内 置 对 象 以 及 ASP.NET 的 配置 管理 ; 第 3 章 介绍 了 ASP.NET 服务 器 控件 的 基 
本 用 法 以 及 不 同类 别 控件 的 功能 ; 第 4 章 介绍 了 CSS 样式 、 主 题 和 母 版 页 ， 这 些 技术 对 于 
页 面 布局 、 创 建 具有 一 致 外 观 的 网 站 非常 有 用 , 也 有 利于 使 站 点 看 起 来 更 专业 和 有 吸引 力 ; 
第 5 章 介绍 了 数据 库 的 基本 知识 和 SQL 语言 、 使 用 ADO.NET 访问 数据 库 、 数 据 绑 定 技术 
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和 数据 控件 的 使 用 以 及 使 用 ADO.NET 读 写 XML 文件 ;第 6 章 介 绍 了 LINQ 语言 及 其 语法 ; 
第 7 ENAT Web 站 点 中 的 安全 性 和 ASP.NET 提供 的 登录 控件 的 用 法 ; 第 8 章 介 绍 了 
ASP.NET AJAX 的 基本 知识 以 及 ASP.NET AJAX 服务 器 控件 的 使 用 方法 ; 第 9 章 介 绍 了 
Web 服务 的 基本 概念 以 及 如 何 创建 和 调用 Web 服务 , 包括 在 AJAX 站 点 中 使 用 Web 服务 ; 
第 10 章 介 绍 了 jQuery 的 基本 语法 和 具体 应 用 ，jQuery 能 够 改变 我 们 编写 JavaScript 脚本 
的 方式 ， 降 低 学 习 和 使 用 Web 前 端 开发 的 复杂 度 ， 提 高 网 页 开发 效率 ; 第 11 章 介绍 了 
Web 应 用 程序 的 发 布 与 部 署 ,包括 复制 Web 站 点 、 在 HS 下 运行 站 点 和 将 数据 库 移动 到 远 
程 服务 器 ; 第 12 章 介 绍 综合 运用 全 书 所 学 知识 ， 开 发 一 个 简易 的 迷你 微 博 系统 。 

本 书 是 多 人 智慧 的 集成 ， 除 封面 署名 的 作者 外 ， 参 与 本 书 编写 的 人 员 还 有 黄 果 、 李 琼 
琼 、 周 倩 芸 、 韩 高 洁 和 郭 纳 等 。 在 本 书 的 编写 过 程 中 ， 参 考 了 一 些 有 关 文 献 ， 在 此 向 这 些 
文献 的 作者 深 表 感 谢 。 由 于 作者 水 平 有 限 ， 本 书 不 足 之 处 在 所 难免 ， 欢 迎 广大 读者 批评 指 
正 。 我 们 的 信箱 :huchenhao@263.net， 电 话 : 010-62796045. 

作 者 
2012 年 9 月 
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ASP.NET 4.0 是 微软 公司 为 了 迎接 网 络 时 代 的 到 来 而 提出 的 一 个 Web 开发 模型 ， 它 是 
建立 在 公共 语言 运行 库 上 的 编程 框架 ,支持 C# 和 VB.NET 语言 。 本 章 将 主要 介绍 网 站 建 
设 的 基础 知识 、ASP.NET 的 基本 原理 及 其 发 展 史 、VWD 2010 开发 环境 , 通过 本 章 的 学 习 ， 
读者 应 该 掌握 如 何 安装 、 使 用 ASP.NET 集成 开发 环境 一 一 VWD 2010， 并 能 够 创建 简单 的 
Web 站 点 。 

网 站 建设 基础 知识 

ASP.NET 的 发 展 史 

VWD 2010 开发 环境 

新 建 Web 站 点 

ASP.NET 应 用 程序 的 工作 原理 


1.1 网 站 建设 概述 


互联 网 最 早出 现 于 20 世纪 60 年 代 末 ， 早 期 的 互联 网 用 户 大 多 限于 教育 和 国防 机 构 。 
随 着 越 来 越 多 的 用 户 在 全 球 范围 内 实现 信息 共享 ， 互 联网 也 逐渐 兴盛 起 来 。 互 联网 的 快速 
发 展 给 入 们 的 工作 、 学 习 和 生活 带 来 了 巨大 变化 ， 极 大 地 提高 了 工作 效率 。 在 互联 网 的 发 
展 过 程 中 ，Web 网 站 的 开发 技术 也 得 到 了 不 断 的 发 展 ， 而 最 为 关键 的 技术 之 一 就 是 网 站 建 
设 技 术 。 本 节 将 介绍 网 站 制作 过 程 中 的 静态 网 站 和 动态 网 站 等 一 些 基 本 概念 。 


1.1.1 HTML 语言 


HTML 的 英文 全 称 是 Hyper Text Markup Language, 直译 为 超 文本 标记 语言 , 它 由 W3C 
组 织 商讨 制定 。HTML 不 是 一 个 程序 语言 ， 而 是 一 种 描述 文档 结构 的 标记 语言 。 

HTML 文档 是 含有 标记 、 文 本 和 影响 文本 的 附加 数据 的 简单 文本 文件 。HTML 与 操作 
系统 平台 的 选择 无 关 ， 只 要 有 Web 浏览 器 就 可 以 运行 HTML 文件 ， 显 示 网 页 内 容 。 

1. HTML 元 素 和 标记 

HTML 用 尖 括 号 间 的 文本 指示 内 容 在 浏览 器 中 如 何 显示 。 这 种 带 有 尖 括 号 的 文本 称 为 
标记 (tag); 含有 文本 或 其 他 内 容 的 一 对 标记 称 为 元 素 。 例 如 : 


<h2> 你 好 </h2> 
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<p> 欢 迎 学 习 ASPNET 4 </p> 


该 示例 的 第 一 行 含 有 一 个 带 起 始 标记 <h2> 和 结束 标记 </h2> 的 <h2> 元 素 。 此 元 素 用 来 
表示 二 级 标题 。 注 意 ， 元 素 的 结束 标记 和 起 始 标记 相似 ， 只 是 前 面 多 了 个 斜 本 0)。 起 始 标 
记 和 结束 标记 之 间 的 所 有 文本 都 被 看 做 是 标题 部 分 。 在 二 级 标题 元 素 下 面 ， 是 一 个 <p> 元 


素 ， 它 用 来 表示 段落 。<p> 标 记 对 中 的 所 有 文本 都 被 看 做 是 段落 部 分 。 
HTML 中 有 许多 可 用 的 标记 ; 在 这 里 就 不 一 一 介绍 了 。 表 1-1 列 出 了 一 些 最 重要 的 


标记 。 
表 1-1 HTML 标记 
标 记 说 BB 示 例 
<html> 
<html> 用 来 表示 整个 页 面 的 开始 和 结束 ...All other content goes here 
</html> 
用 来 表示 包含 页 面 数据 的 页 面 的 <head> 
<head> 特殊 部 分 ， 包 括 其 标题 以 及 对 外 ... Content goes here 
部 资源 的 引用 </head> 
<title> 
用 米 定 义 页 面 的 标题 。 这 个 标题 | 
<title> ' I i 首页 
将 会 显示 在 浏览 器 的 标题 栏 中 
</title> 
<body> 
<body> 用 来 表示 页 面体 的 开始 和 结束 Page body goes here 
</body> 
用 来 将 一 个 Web 页 面 链接 到 另 一 <a href="http://www.baidu.com"> 
<a> 
i 个 页 面 百度 一 下 </a> 
<img> 用 来 向 页 面 中 嵌入 图 像 <img src="Logo.gif' /> 
<b> 这 是 <b> 粗 体 </b> 
. 用 来 将 文本 格式 化 为 粗 体 、 斜 体 BAA . 
<i> . : <i> 这 里 是 斜体 </i> 
或 下 划 线 字体 
<u> 
<form> . . 下 <input type="text" value=" 
用 于 描述 允许 用 户 向 服务 器 提交 、 
<input> 中 请 输入 "这 
信息 的 输入 格式 
<select> 
ii 这 些 标 记 用 来 创建 含有 表格 的 布 <table> <tr> 
<table> 
T 局 。<table> 标 记 定义 了 整个 表 ， <td> 第 一 列 </td><td> 第 二 列 </td> 
<tr> 
i 而 <t> 和 <td> 标 记分 别 用 来 定义 </tr> </table> 
<t 


行 和 单元 格 
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( 续 表 ) 
标 记 说 BB m _ Bl 
<ul> 这 3 个 标记 用 来 创建 带 有 编号 或 <ol> 
i 项 目 符号 的 列表 。<ul> 和 <ol> 标 <1i> 有 编号 的 1</li> 
<ol> 
1 记 定义 了 列表 的 外 观 , 而 <li> 标 记 <1i> 有 编号 的 2</li> 
<li> 
用 来 表示 列表 中 的 项 <lol> 
这 个 标记 用 来 包装 和 影响 文档 
这 个 本 记 用 来 包装 和 影响 文档 的 ee 
<span> 其 他 部 分 。 它 作为 内 联 文 本 出 现 ， 
Ted:"> 红 色 文本 </span></p> 
所 以 不 会 向 页 面 添加 换行 符 
与 <span> 标 记 一 样 ，<div> 标 记 用 
<div> 
<div> 来 作为 其 他 元 素 的 容器 。 默 认 情 . 
sini a This is some text on 1 line 
况 下 <div> 元 素 后 面 出 现 显 式 的 
</div> 
换行 符 
2. HTML 属性 


除了 有 HTML 元 素 之 外 ， 还 有 HTML 属性 。 这 些 属性 包含 了 一 些 改变 特定 元 素 行为 
方式 的 额外 信息 。 例 如 ， 使 用 <img> 标 记 显示 一 个 图 像 ，sre 属性 用 于 定义 图 像 的 源 代码 。 
通常 ， 不 需要 记 住 所 有 这 些 元 素 和 属性 。 在 大 多 数 情况 下 ，VWD 会 自动 地 生成 它们 ， 当 
需要 手工 输入 时 ， 也 会 给 出 智能 提示 ， 帮 助 找到 正确 的 标记 或 属性 。 

说 明 : 

除了 标记 ， 在 HTML 中 还 常常 引用 脚本 语言 (Scripting Language)， 如 JavaScript 和 
VBScript。 使 用 脚本 语言 ， 可 以 制作 出 网 页 特效 和 一 些 简单 的 动态 效果 。 


3. HTML 和 XHTML 的 区 别 

BRT HTML 之 外 ， 还 有 XHTML。 虽 然 两 者 的 名 称 看 起 来 非常 相似 ， 但 是 它们 之 间 有 
一 些 有 趣 的 区 别 。 XHTML(eXtensible Hypertext Markup Language) 称 为 可 扩展 超 文本 标记 语 
言 ， 是 为 了 使 HTML 向 XML(eXtensible Markup Language) 过 渡 而 定义 的 标记 语言 ， 它 以 
HTML 为 基础 ， 采 用 XML 严谨 的 语法 结构 。XML 是 一 种 通用 的 、 用 来 描述 数据 的 、 基 于 
文本 与 标记 的 语言 ， 也 是 作为 其 他 许多 语言 (包括 XHTML) 的 基础 语言 。 

XHTML 很 大 程度 上 是 用 XML 规则 重 写 的 HTML。 在 XHTML F, 如果 用 <p> 开 始 了 
一 个 段落 ， 就 必须 在 页 面 后 面 的 某 个 地 方 用 </p> 闭 合 该 段落 。 对 于 没有 结束 标记 的 标记 也 
是 如 此 ， 比 如 <img> 或 <br>( 用 来 输入 一 个 换行 符 )。 在 XHTML 中 ,这些 标记 被 写 为 自 结束 
标记 ， 其 中 结束 标记 中 的 斜 杠 直接 嵌 在 标记 自身 中 ， 例 如 : 


<img src="Logo.gif' 人 或 <br /> 


XML 是 区 分 大 小 写 的 , XHTML 通过 强制 所 有 标记 采用 小 写 来 应 用 该 规则 。 虽 然 标记 
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和 特性 必须 都 是 小 写 ， 但 是 实际 值 不 必 是 这 样 。 例 如 ， 前 面 显示 logo 图 像 的 示例 是 完全 有 
效 的 XHTML， 这 里 的 图 像 名 称 中 使 用 了 大 写 的 工 。 

大 部 分 的 浏览 器 都 可 以 正确 解析 XHTML， 即 使 老 版 本 的 浏览 器 ， 也 将 XHTML 作为 
HTML 的 一 个 子 集 。 

注意 : 

除了 HTML 之 外 ，ASPNET Web 页 面 也 可 能 包含 其 他 标记 。 大 多 数 页 面 上 都 有 一 个 
或 多 个 ASPNET 服务 器 控件 ， 给 出 了 一 些 附 加 的 功能 。 本 书 第 3 章 将 深入 介绍 ASPNET 
服务 器 控件 。 


1.1.2 静态 网 站 


静态 网 站 是 指 全 部 由 HTML 代码 格式 页 面 组 成 的 网 站 ， 所 有 的 内 容 包含 在 网 页 文件 
中 ， 文 件 扩展 名 为 ，.htm、.html、.shtml、.xml 等 。 网 页 上 也 可 以 出 现 各 种 视觉 动态 效果 ， 
如 GIF 动画 、FLASH 动画 和 滚动 字幕 等 。 

早期 的 网 站 一 般 都 是 采用 静态 网 页 技术 制作 的 静态 网 站 。 这 里 所 讨论 的 “ 静 ” 是 指 网 
页 内 容 在 用 户 发 出 请 求 之 前 就 已 经 生成 了 (也 就 是 说 , 用 户 每 次 总 能 看 到 相同 的 页 面 ), Web 
服务 器 只 负责 保存 和 传递 HTML 文件 ， 而 不 进行 额外 处 理 , 用 户 只 能 阅读 网 站 所 提供 的 信 
息 ， 这 种 页 面 的 请 求 模式 如 图 1-1 所 示 。 

请 求 文件 


HIML 
Was 网 页 文件 
传输 文件 


图 1-1 静态 网 站 模型 


用 户 端 


可 将 静态 网 页 的 特点 简要 归纳 如 下 。 

(1) 静态 网 页 每 个 网 页 都 有 一 个 固定 的 URL， 且 网 页 URL 以 .htm、.html、.shtml 等 常 
见 形式 为 后 级 。 

(2) 网 页 内 容 一 经 发 布 到 网 站 服务 器 上 ， 无 论 是 否 有 用 户 访问 ， 每 个 静态 网 页 的 内 容 
都 是 保存 在 网 站 服务 器 上 的 ， 每 个 网 页 都 是 一 个 独立 的 文件 。 

G) 静态 网 页 的 内 容 相对 稳定 ， 因 此 容易 被 搜索 引擎 检索 、 访 问 速 度 比 较 快 。 

(4) 静态 网 页 没有 数据 库 的 支持 ， 在 网 站 制作 和 维护 方面 工作 量 较 大 ， 因 此 当 网 站 信 
息 量 很 大 时 完全 依靠 静态 网 页 制作 方式 比较 困难 。 

(5) 静态 网 页 的 交互 性 差 ， 在 功能 方面 有 较 大 的 限制 。 为 了 不 断 更 新 网 页 内 容 ， 网 站 
管理 者 必须 不 断 地 重复 制作 HTML 文件 ， 随 着 网 站 内 容 和 信息 量 的 日 益 增长 , 维护 工作 将 
变 得 十 分 复杂 。 
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1.43 动态 网 站 


什么 是 动态 网 站 呢 ? 所 谓 “ 动 ”， 并 不 是 指 网 页 上 的 GIF 等 动画 图 片 ， 而 是 指 用 户 与 
网 站 的 交互 性 和 互动 性 。 动 态 网 站 一 般 应 满足 以 下 特征 。 

1. 交互 性 

动态 网 站 中 的 网 页 会 根据 用 户 的 要 求 和 选择 而 作出 改变 和 响应 。 网 站 管理 员 只 需要 掌 
握 计算 机 基本 操作 方法 ， 就 可 以 方便 、 及 时 地 更 新 网 站 内 容 ， 浏 览 网 站 的 用 户 可 以 在 网 站 
中 进行 查询 和 留言 竺 操作。 可见， 动态 网 站 技术 大 大 增加 了 客户 与 网 站 的 交互 性 。 

2. 通过 数据 库 进行 架构 

在 动态 网 站 中 ， 网 络 管理 员 除 了 要 设计 网 页 视觉 效果 ， 还 要 设计 数据 库 和 程序 代码 来 
使 网 站 具有 更 多 自动 的 和 高 级 的 功能 。 例如 , 购物 网 站 中 含有 大 量 的 商品 种 类 和 数量 信息 ， 
为 了 方便 查找 ， 就 应 搭建 数据 库 平 台 在 网 页 上 实现 自动 搜索 。 现 在 广泛 使 用 的 网 上 交易 系 
统 、 在 线 采购 系统 以 及 商务 交流 系统 等 都 是 由 数据 库 提供 技术 支持 的 。 

3. 在 服务 器 端 运行 ， 方 便 更 新 

在 服务 器 端 运 行 的 程序 、 网 页 、 组 件 ， 会 随 不 同 客户 、 不 同 要 求 返 回 不 同 的 页 面 ， 网 
站 管理 员 无 须 手动 更 新 网 页 文档 ， 可 以 大 大 节省 网 站 管理 的 工作 量 ， 如 图 1-2 所 示 。 


(用 户 端 ) (服务 器 端 ) (数据 库 ) 


图 1-2 动态 网 站 模型 


由 上 述 特征 可 以 看 出 ， 静 态 网 站 和 动态 网 站 的 主要 区 别 在 于 : 静态 网 站 的 内 容 是 在 用 
户 发 出 请 求 之 前 就 预先 生成 的 ， 而 动态 网 站 的 内 容 则 是 在 用 户 发 出 请 求 之 后 才 产 生 的 。 

动态 网 站 在 发 出 请 求 之 后 生成 内 容 有 两 个 明显 的 优点 。 

° 首先 ,服务 器 端 可 以 根据 用 户 提交 的 请 求 以 及 请 求 中 的 信息 来 生成 页 面 的 内 容 。 如 ， 
在 一 个 电子 商务 网 站 提交 用 户 名 和 密码 , 那么 用 户 看 到 的 下 一 个 页 面 就 是 动态 生成 
的 ， 它 包含 了 用 户 的 私有 账户 信息 。 

e 其 次 , 服务 器 端 可 以 根据 最 新 的 可 用 信息 来 设置 它 所 生成 的 页 面 内 容 。 如 显示 网 站 
的 当前 在 线 用 户 数 。 在 线 用 户 数 是 实时 信息 ， 是 在 Web 服务 器 接收 用 户 请 求 时 获 
取 的 。 
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静态 网 站 和 动态 网 站 各 有 特点 ， 搭 建 网 站 采用 动态 还 是 静态 技术 主要 取决 于 网 站 的 功 
能 需求 和 内 容 的 多 少 ， 如 果 网 站 功能 比较 简单 ， 内 容 更 新 量 不 是 很 大 ， 那 么 采用 静态 网 站 
的 方式 会 更 简单 ， 反 之 ， 就 要 采用 动态 网 站 技术 来 实现 。 

说 明 : 

静态 网 站 可 以 使 用 Frontpage 或 Dreamweaver 等 网 页 编辑 工具 来 建立 ， 而 动态 网 站 则 
需要 使 用 服务 器 端 网 页 技术 ， 如 通过 本 书 介 绍 的 ASPNET 来 搭建 。 


1.2 ASP.NET 与 VWD 2010 


ASP.NET 是 由 Microsoft 公司 提出 的 动态 网 站 设计 技术 与 程序 框架 ， 它 带 给 人 们 的 是 
全 新 的 技术 ， 和 由 此 产生 的 开发 效率 的 提高 ， 网 站 性 能 的 提升 。 使 用 ASP.NET 提供 的 内 
置 服务 器 控件 或 第 三 方 生成 的 控件 ， 可 以 创建 既 复 杂 又 灵活 的 用 户 界面 ， 大 幅度 减少 动态 
网 站 的 开发 工作 。 目 前 ，ASPNET 作为 Windows 平台 上 流行 的 网 站 开发 工具 ， 能 够 提供 
各 种 方便 的 Web 开发 模型 , 利用 这 些 模型 用 户 能 够 快速 地 开发 出 动态 网 站 所 需 的 各 种 复杂 
功能 。 


1.2.1 ASPNET 的 发 展 史 


自从 .NET Framework 1.0 在 2002 年 初 首次 发 布 以 来 ，Microsoft 花 了 大 量 精力 和 时 间 
来 开发 ASP.NET， 它 是 .NET Framework 的 一 部 分 ， 可 以 用 来 构建 Web 应 用 程序 。 下 面 先 
来 看 一 下 ASP.NET 的 发 展 历史 。 

早期 的 Web 程 序 开发 是 十 分 繁琐 的 事情 ,一 个 简单 的 动态 页 面 需 要 编写 大 量 的 代码 (一 
般 用 C 语言 ) 才 能 完成 。 

1996 年 ，Microsoft 推出 了 ASP(Active Server Page， 活 动 服 务 器 页 面 ， 现 在 人 们 常 称 
之 为 传统 ASP)1.0 版 。 它 允许 采用 VBScriptJavaScript 这 些 简 单 的 脚本 语言 编写 代码 ， 允 
许 将 代码 直接 嵌入 HTML 中 ， 从 而 使 得 设计 动态 Web 页 面 的 工作 变 得 简单 。ASP 能 够 通 
过 内 置 的 组 件 ， 实 现 强大 的 功能 (如 Cookie). ASP 最 显著 的 贡献 就 是 推出 了 ActiveX Data 
Objects(ADO)， 它 使 得 程序 对 数据 库 的 操作 变 得 十 分 简单 。 

1998 年 ， 微 软 发 布 了 ASP 2.0 和 IIS 4.0。 与 前 一 版 相 比 ，2.0 版 最 大 的 改进 是 外 部 的 
组 件 需 要 初始 化 。 用户 能 够 利用 ASP 2.0 和 IIS 4.0 构建 各 种 ASP 应 用 , 而 且 每 个 组 件 有 了 
己 单独 的 内 存 空间 ,方便 进行 事务 处 理 。 随 后 , 微软 在 Windows 2000 Server 系统 中 提供 
T HS 5.0 和 ASP 3.0。 此 次 升级 ， 最 主要 的 改变 就 是 把 很 多 事情 交 给 COM+ 来 做 ， 效 率 比 
以 前 的 版 本 更 高 ， 而 且 更 稳定 。 

ASP.NET 是 Microsoft 公司 于 2002 年 推出 的 新 一 代 体 系 结构 Microsoft .NET 的 一 部 分 ， 

来 在 服务 器 端 构建 功能 强大 的 Web 应 用 .ASP.NET 1.0 在 结构 上 与 传统 的 ASP 版 本 截然 
不 同 ， 它 几乎 完全 是 基于 组 件 和 模块 化 的 。 


~m 
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说 明 : 
ASPNET 提出 了 代码 隐藏 类 (CodeBehind) 的 概念 ， 把 逻辑 代码 (.aspx.cs) 和 表现 页 面 
(.aspX) 分 离开 来 ， 使 用 户 很 容易 使 用 后 台 代 码 来 控制 页 面 的 逻辑 功能 。 


2003 年 ，Microsoft 公司 发 布 了 Visual Studio .NET 2003, 提供 了 在 Windows 操作 系统 
下 开发 各 类 基于 .NET 框架 的 全 新 的 应 用 程序 开发 平台 ( 称 为 .NET 1.1)。 

2005 年 11 月 ，Microsoft 发 布 了 Visual Studio 2005 和 ASPNET 2.0。 它 修正 了 以 前 版 
本 中 的 一 些 Bug， 并 在 移动 应 用 程序 开发 、 代 码 安全 以 及 对 Oracle 数据 库 和 ODBC 的 支持 
等 方面 都 做 了 很 多 改进 。 

尽管 Visual Studio 2005 和 ASPNET 2.0 的 功能 已 经 很 丰富 了 ， 但 Microsoft 仍旧 努力 
向 2007 年 11 月 发 布 的 Visual Studio 2008 和 ASP.NET 3.5 中 添加 了 一 系列 很 酷 的 新 功能 。 
主要 的 新 功能 包括 LINQ 以 及 AJAX 框架 整合 。 

2008 年 8 月 ,Microsoft 又 发 布 了 用 于 Visual Studio 和 .NET Framework 的 Service Pack 1, 
其 中 引入 了 一 些 重要 的 新 功能 ， 如 ADO.NET Entity Framework 和 动态 数据 。 

目前 的 最 新 版 本 是 Visual Studio 2010( 通 常 读 作 twenty-ten) 和 ASP.NET 4.0， 它 是 在 已 
成 功 发 行 的 Visual Studio 2008 和 ASP.NET 3.5 的 基础 之 上 构建 的 , 保留 了 其 中 很 多 令 人 喜 
爱 的 功能 ， 还 增加 了 一 些 其 他 领域 的 新 功能 和 工具 。 


1.2.2 ASPNET 的 工作 原理 


ASP.NET 不 只 是 一 个 运行 库 宿 主 ， 它 是 使 用 托管 代码 开发 网 站 和 通过 Internet 分 布 的 
对 象 的 完整 结构 。Web 窗 体 和 XML Web 服务 都 将 IIS 和 ASP.NET 用 做 应 用 程序 的 发 布 
机 制 。 

ASP.NET 的 工作 原理 如 图 1-3 所 示 。 

ASP.NET 承 载 


- XML Web 服 务 应 
用 程序 


”ASP.NET 承载 
国 几 web 窗 体 应 用 程序 


客户 端 


图 1-3 ASPNET 工作 原理 


当 在 浏览 器 中 输入 某 网 站 的 域名 或 IP 地 址 并 按 下 Enter 键 时 ， 浏 览 器 就 会 向 服务 器 发 
送 一 个 请 求 , 这 一 过 程 是 通过 HTTP(HyperText Transfer Protocol, 超 文本 传输 协议 ) 完 成 的 。 
服务 器 是 活动 状态 并 且 请 求 有 效 时 ， 服 务 器 就 会 接受 请 求 ， 处 理 请 求 ， 然 后 将 响应 发 回 
到 客户 机 浏览 器 上 。 


lK 
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与 传统 的 ASP 技术 相 比 ,ASPNET 支持 .NET Framework 的 任何 语言 开发 Web 窗 体 页 ， 
而 且 代码 不 再 需要 与 HTML 文本 共享 同一 个 文件 (当然 也 可 以 继续 共享 同一 个 文件 )。Web 
窗 体 页 用 本 机 语言 执行 ， 这 是 因为 与 所 有 其 他 托管 应 用 程序 一 样 ， 它 们 充分 利用 运行 库 。 
ASP.NET 页 面 的 处 理 过 程 如 下 。 
e 用 户 通 过 客户 端 浏览 器 请 求 页 面 ， 页 面 第 一 次 运行 ， 执 行 初步 处 理 。 
o 执行 的 结果 以 标记 的 形式 呈现 给 浏览 器 ， 浏 览 器 对 标记 进行 解释 并 显示 给 用 户 。 
° 用 户 输 入 信息 或 者 进行 选择 或 者 单 击 按钮 等 进行 交互 。 
页 面 发 送 回 服务 器 ， 在 ASP.NET 中 称 此 为 “ 回 发 ”。 
e Web 服务 器 接 到 回 发 请 求 ， 在 此 运行 该 页 ， 并 且 使 用 用 户 输入 或 选择 的 信息 。 
服务 器 将 运行 后 的 页 面 以 HTML 或 XHTML 标记 的 形式 发 送 到 客户 端 浏览 器 。 


1.23 VWD 2010 


进行 ASP.NET 开发 可 以 使 用 Visual Basic.NET 或 者 C#， 这 两 种 语言 都 是 .NET 环境 下 
的 程序 设计 语言 ,但 并 不 是 必须 使 用 .NET 集成 开发 环境 才能 进行 ASPNET Web 程序 设计 。 
因为 ASP.NET 文件 实际 上 是 一 个 纯 文本 的 文件 ， 编 译 工作 是 在 用 户 向 服务 器 第 一 次 发 出 
对 该 文件 的 HTTP 请 求 时 由 Web 服务 器 进行 的 ， 并 不 是 由 VS 完成 的 。 从 理论 上 讲 ， 用 记 
事 本 或 其 他 文本 编辑 器 就 可 以 编写 ASP.NET Web 应 用 程序 ， 但 大 多 数 开发 人 员 还 是 希望 
安装 Microsoft Visual Web Developer 2010(VWD)。VWD 是 专门 为 构建 ASP.NET Web 站 点 
而 开发 的 ， 其 中 包含 了 大 量 有 助 于 快速 创建 复杂 ASP.NET Web 应 用 程序 的 工具 。 

Visual Web Developer 有 两 个 版 本 : 一 个 是 独立 而 免费 的 版 本 ， 称 为 Microsoft Visual 
Web Developer 2010 Express; 还 有 一 个 版 本 是 作为 较 大 的 开发 套件 Visual Studio 2010 的 一 
部 分 ， 它 有 不 同 的 版 本 可 用 ， 且 各 个 版 本 的 价格 各 不 相同 。 虽 然 VWD 的 Express 版 本 是 
免费 的 , 但 是 它 包 含 了 创建 复杂 且 功 能 丰富 的 Web 应 用 程序 所 需 的 所 有 功能 和 工具 。 本 书 
中 的 所 有 示例 都 可 以 用 该 版 本 构建 出 来 。 

1. 获取 Visual Web Developer 2010 


可 以 从 Microsoft 站 点 http:/www.microsoft.com/express/ 上 下 载 VWD 的 免费 版 本 。 在 
Express 的 主页 上 ， 依 次 单 击 Download 链接 ， 直 到 打开 提供 了 下 载 Express 产品 的 下 载 页 
面 ， 其 中 包括 Visual Web Developer 2010 Express 版 本 。 在 这 个 页 面 上 可 以 以 Web 安装 方 
式 下 载 Visual Web Developer 2010 Express 版 本 ， 这 里 只 下 载 安装 程序 ， 文 件 的 其 余部 分 
将 在 安装 过 程 中 下 载 。 

也 还 可 以 从 www.microsoft.com/web 和 www.asp.net/vwd/ 站 点 上 下 载 Microsoft Web 
Platform Installer(WPI) 应 用 程序 ， 其 中 就 包含 了 VWD。 除 了 VWD 以 外 ， 这 个 工具 还 便于 
访问 其 他 许多 与 Web 开发 相关 的 工具 和 程序 。 通 过 使 用 WPI 这 个 优秀 的 工具 ， 可 以 同时 
获得 大 量 与 Web 开发 相关 的 程序 和 工具 。 

说 阴 : 

EARP, A C# 作 为 编程 语言 ， 以 VWD 2010 作为 开发 环境 ， 进 行 ASPNET 动态 网 
站 开发 ， 因 此 需要 把 它 安 装 到 开发 机 器 上 . 
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2. 安装 VWD Express 版 本 


Visual Web Developer 的 安装 很 简单 ， 只 是 过 程 有 点 长 。 根 据 所 选 的 安装 方法 、 计 算 机 
配置 和 Intemet 连接 速度 ， 安 装 VWD 可 能 需要 半 个 小 时 到 一 个 小 时 ， 甚 至 更 长 时 间 。 

安装 Visual Studio 2010 的 完整 版 本 与 之 类 似 ， 只 是 中 间 步 骤 可 能 略 有 不 同 。 不 管 安装 
VWD 的 哪个 版 本 ， 都 要 安装 SQL Server 2008， 本 书 的 很 多 示例 都 会 用 到 这 个 组 件 。 如 果 
安装 的 是 Visual Studio 2010 的 完整 版 , 那么 在 安装 过 程 中 会 看 到 要 安装 的 功能 列表 中 包括 
安装 SQL Server 的 选项 。 如 果 安 装 VWD Express 版 本 ，“ 安 装 选项 ”对 话 框 中 就 会 出 现 
选择 SQL Server 的 选项 。 

安装 步骤 如 下 : 

(1) 运行 从 Microsoft Web 站 点 上 下 载 的 文件 。 或 者 从 安装 光盘 上 启动 安装 过 程 。 将 开 
始 下 载 Web 平台 安装 程序 文件 。 

(2) 下 载 完 以 后 ， 打 开 “Web 平台 安装 程序 1.0”， 单 击 “ 安 装 ” 按 钮 ， 出 现 软 件 的 
许可 条 款 ， 如 图 1-4 所 示 。 在 该 列表 中 ， 包 括 VWD 2010 依赖 的 所 有 应 用 程序 和 组 件 。 如 
果 没 有 看 到 SQL Server 选项 ， 则 表示 已 经 安装 过 了 。 

(3) 阅读 并 接受 许可 条 款 ， 单 击 “ 我 接受 ”按钮 将 开始 下 载 安 装 ， 下 载 和 安装 的 过 程 
与 需要 安装 的 组 件 有 关 。 

(4) 完成 了 应 用 程序 的 安装 后 ， 可 能 会 出 现 一 个 对 话 框 ， 要 求 重启 计算 机 。 重 启 后 ， 
VWD 就 可 以 使 用 了 。 


C) 


请 查看 下 面 的 列表 , 应 用 程序 软件 、Microsoft 产品 和 姐 件 ， 还 包括 要 启动 的 Windows 姐 件 。 
第 三 : EPS B EE Microsoft 未 授予 您 第 三 方 软件 的 任何 权利 。 您 有 责任 而 且 必 须 分 别 找 
到 、 阅 读 并 接受 第 三 方 许可 条 款 。 


10.42 MB 


二 BIT13607022/1033/x66/S9LSysClrTypes msi a m 
如 果 单 击 我 接受 "， 即 表示 您 同意 上 面 列 出 的 第 三 方 和 Microsoft 软件 的 许可 条 款 。 加 果 您 不 同意 所 有 许可 条 款 ， 请 单 击 
我 拒绝 "。 


图 1-4 软件 许可 条 款 


3. VWD 2010 提供 的 功能 
VWD 2010 提供 了 如 下 功能 


加 ASPNET 4.0 网 站 开发 实例 教程 


e 网 页 设计 : VWD 2010 内 置 功能 强大 的 网 页 编辑 器 , 包含 所 见 即 所 得 的 编辑 模式 和 
HTML 编辑 模式 ， 以 及 智能 感应 功能 和 验证 功能 。 支 持 所 见 即 所 得 的 拖 动 界面 ， 
可 以 创建 美观 、 易 用 的 网 站 。 

e 代码 编辑 : VWD 2010 提供 代码 编辑 器 ， 使 用 户 可 以 使 用 Visual Basic.NET 或 C# 
编写 动态 网 页 的 代码 。 代 码 编辑 器 包括 语法 修饰 和 智能 感应 功能 。 

e 调试 : 提供 调试 器 ， 帮 助 用 户 查 找 程序 中 的 错误 。 

e 控件 : ASP.NET Web 服务 器 控件 整合 了 创建 网 站 所 需 的 大 部 分 功能 ， 用 户 可 以 快 
速 开发 Web 应 用 程序 。 

e 数据 访问 : 支持 用 户 在 网 页 中 显示 和 编辑 数据 。 数 据 可 以 位 于 各 种 数据 存储 区 中 ， 
其 中 包括 数据 库 或 XML 文件 。 在 很 多 情况 下 ， 用 户 无 须 编写 任何 代码 ， 即 可 向 网 
页 中 添加 和 编辑 数据 。 

° 对 文件 传输 协议 (FTP) 的 内 置 支持 : 使 用 VWD 2010 的 FTP 功能 ， 可 以 直接 连接 
到 服务 器 ， 然 后 在 该 服务 器 上 创建 和 编辑 文件 。 

o 内 置 Web 服务 器 : VWD 2010 包含 了 一 个 内 置 的 Web 服务 器 , 方便 开发 人 员 创 建 
和 调试 ASP.NET Web 应 用 程序 。 因 此 ， 用 户 不 需要 再 安装 和 配置 IS 服务 器 ， 就 
可 以 开发 ASPNET Web 应 用 程序 。 

o 微软 AJAX: 微软 AJAX 的 一 个 重要 特性 是 ， 它 与 其 他 客户 端 架构 (包括 jQuery) 
具有 很 好 的 互 操作 性 。 除 了 实现 无 闪烁 页 面 的 控件 之 外 , 微软 AJAX 还 提供 了 更 多 
的 服务 器 控件 来 创建 交互 式 的 且 有 响应 的 用 户 界面 。 


理 客户 端 事件 、 提供 视觉 效果 (如 动画 ) 支 持 , 以 及 在 应 用 程序 中 Ajax 的 使 用 变 得 更 
加 简单 。VWD 2010 包含 了 目前 最 新 的 稳定 版 本 jQuery 1.4。 使 用 ASP.NET Web 
站 点 模板 创建 的 任意 新 Web 站 点 都 包含 一 个 Scripts 文件 夹 ， 其 中 已 经 包含 了 必要 
的 jQuery 文件 。 

© MVC2.0: ASP.NET MVC 模式 是 一 种 表现 模式 。 它 将 Web 应 用 程序 分 成 3 个 主要 
组 件 ， 即 : 模型 (Model)、 视 图 (View) 和 控制 器 (Controller)。 在 ASP.NET MVC 中 ， 

“请 求 一 一 处 理 一 一 响应 ”的 模型 变 得 更 加 简单 。View 和 Controller 之 间 不 再 有 强 
合 ， 而 且 页 面 没有 复杂 的 生命 周期 。 

° 多 显示 器 支持 : 比如 将 代码 编辑 器 放置 在 主 显示 器 中 ,将 输出 窗口 、 类 图 窗口 和 代 
码 定义 窗口 等 提供 辅助 信息 的 窗口 放置 在 副 显 示 器 中 , 这 样 就 可 以 在 主 窗口 中 编辑 
代码 ， 同 时 可 以 在 有 需要 的 时 候 ， 可 以 及 时 地 从 辅助 窗口 中 得 到 一 些 有 用 的 辅助 
信息 。 


13 使 用 VWD 2010 开发 Web 应 用 程序 


现在 已 经 安装 了 VWD， 接 下 来 就 可 以 启动 并 使 用 它 来 创建 ASP.NET 应 用 程序 了 。 本 
节 将 介绍 VWD 2010 的 常用 窗口 和 基本 界面 ,以 及 如 何 使 用 VWD 2010 创建 ASP.NET Web 
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应 用 程序 。 
1.3.1 启动 VWD 2010 


单 击 Windows 的 “开始 ”菜单 ， 选 择 “ 所 有 程序 ”| Microsoft Visual Studio 2010 Express | 
Microsoft Visual Web Developer 2010 Express 命令 ， 即 可 启动 VWD 2010， 如 图 1-5 所 示 。 


w r E) Microsoft SQL Server 2008 » 
Ed 空当 接龙 Ë) Microsoft Silverlight 3 SDK - PX 简体 ) , 
Ñ& Microsoft Visual Studio 2010 Express , 
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Tastaller E) IIS 7.0 Extensions , 
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图 1-5 通过 开始 菜单 启动 VWD 2010 


首先 出 现 的 是 软件 版 本 界面 ， 几 秒 钟 之 后 ， 软 件 版 本 界面 消失 ， 出 现 “起 始 页 ”界面 ， 
如 图 1-6 所 示 。 
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图 1-6 “起 始 页 ”界面 


起 始 页 包括 “最 近 使 用 的 项 目 ” 和 联机 资源 以 及 新 建 和 打开 项 目的 快捷 操作 。 为 了 介 
绍 VWD 2010 的 操作 环境 ， 先 新 建 一 个 网 站 。 

在 “起 始 页 ”中 单 击 “ 新 建 网 站 ”链接 ， 或 者 选择 “文件 ”|“ 新 建 网 站 ”命令 ， 打 开 
“新 建 网 站 ”对 话 框 ， 如 图 1-7 所 示 。 

该 对 话 框 显示 了 已 经 安装 的 模板 ， 这 里 选择 “ASP.NET 网 站 ”模板 ， 在 “Web 位 置 ” 
下 拉 列 表 中 选择 “文件 系统 ”选项 ， 然 后 在 后 面 的 文本 框 中 输入 存储 位 置 ， 或 者 单 击 “ 浏 
览 ” 按 钮 选择 一 个 新 位 置 ， 单 击 “ 确 定 ” 按 钮 即 可 创建 一 个 ASP.NET 网 站 。 
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图 1-7 “新 建 网 站 ”对 话 框 


通过 此 模板 新 建 的 网 站 是 一 个 基于 母 版 页 Site.master 的 简易 站 点 。 其 中 包括 名 为 
Default.aspx 的 标准 页 面 ， 一 个 web.config 文件 ， 一 组 包括 注册 、 登 录 、 修 改 密码 等 功能 的 
通用 页 面 ， 一 个 关于 页 面 About.aspx， 以 及 一 个 空 的 App_Data 文件 夹 ， 如 图 1-8 所 示 。 
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图 1-8 VWD 2010 主 开发 界面 


说 明 : 
使 用 “ASPNET 网 站 ”模板 新 建 的 站 点 包括 了 注册 登录 以 及 后 台数 据 库 的 相关 功能 
不 适合 初学 者 ， 所 以 本 书后 面 将 介绍 的 站 点 大 都 基于 “ASPNET 空 网 站 ”模板 创建 。 


VWD 2010 的 主 界面 包括 标题 栏 、 菜 单 栏 、 工 具 栏 、 工 具 箱 、 解 决 方案 资源 管理 器 、 
数据 库 资 源 管理 器 、 属 性 窗口 和 文档 窗口 等 。 

1. 菜单 栏 
开发 界面 的 最 上 方 是 标题 栏 ， 标 题 栏 的 下 面 就 是 菜单 栏 ， 包 括 “ 文 件 ”、“ 编 辑 ”、 
“视图 ”、“ 网 站 ”、“ 调 试 ”、“ 格 式 ”、“ 工 具 ”、“ 窗 口 ”和 “帮助 ”9 个 主 菜单 。 
根据 执行 的 具体 任务 ， 主 菜单 也 会 有 很 大 的 变化 ， 因 此 ， 在 使 用 应 用 程序 的 过 程 中 就 会 发 
现 某 些 菜单 有 时 出 现 ， 有 时 消失 。 
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2. 工具 栏 


菜单 栏 的 下 面 就 是 工具 栏 ， 利 用 不 同 的 工具 栏 ， 可 以 快速 地 访问 VWD 中 的 大 部 分 常 
用 功能 。 图 1-9 中 只 显示 了 2 个 工具 栏 (标准 和 格式 设置 )， 如 果 要 打开 或 关闭 某 个 工具 栏 ， 
可 以 右 击 现 有 的 工具 栏 ， 或 者 选择 “视图 ”| “工具 栏 ” 菜单， 从 弹出 的 子 菜单 中 选择 相应 
的 菜单 项 即 可 ， 如 图 1-9 所 示 。 

3. 工具 箱 


默认 情况 下 ， 在 主 窗口 的 左 侧 ， 可 以 看 到 折 装 的 工具 箱 选项 卡 ， 将 鼠标 指针 移动 到 该 
选项 卡 上 悬 停 几 秒 ， 工 具 箱 就 会 展开 ， 如 图 1-10 所 示 。 

与 菜单 栏 和 工具 栏 一 样 ， 在 执行 不 同 的 任务 时 ， 工 具 箱 也 可 能 会 变化 ， 以 显示 相关 的 
控件 。 可 以 简单 地 通过 拖 动 鼠 标的 方式 将 工具 箱 中 的 控件 放 到 页 面 中 的 合适 位 置 。 工 具 箱 
中 的 控件 包含 多 个 分 类 ， 用 户 可 以 根据 需要 展开 或 折 印 某 个 分 类 ， 以 便 找到 需要 的 控件 。 
本 书 第 3 章 将 重点 介绍 工具 箱 中 各 种 控件 的 使 用 。 
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图 1-9 “视图 ”|“ 工 具 栏 ” 子 菜单 图 1-10 工具 箱 


提示 : 

如 果 在 主 窗口 左 侧 找 不 到 工具 箱 ， 可 以 使 用 Ctri+Alt+X 组 合 键 或 者 选择 “视图 ”|“ 其 
他 窗口 ”|“ 工 具 箱 ”命令 来 打开 它 。 

4. 解决 方案 资源 管理 器 

窗口 的 右上 角 是 “解决 方案 资源 管理 器 ”窗口 ， 如 图 1-11 所 示 。 在 “解决 方案 资源 管 
理 器 ”窗口 中 ， 文 件 被 分 门 别 类 地 存储 在 不 同 的 文件 夹 中 ， 可 以 通过 该 窗口 向 站 点 中 添加 
新 的 文件 夹 和 文件 ， 也 可 以 从 项 目 中 删除 文件 或 更 改 文件 或 文件 名 。 解 决 方案 资源 管理 器 
的 大 部 分 功能 都 集中 在 它 的 右键 菜单 中 。 
在 “解决 方案 资源 管理 器 ”窗口 的 位 置 还 有 一 个 “数据 库 资源 管理 器 ”窗口 ， 通 过 该 
窗口 ， 可 以 使 用 数据 库 ， 它 提供 了 创建 新 数据 库 和 打开 现 有 数据 库 、 向 数据 库 中 添加 新 的 
表 和 查询 工具 。 
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5. 属性 窗口 


“属性 ”窗口 位 于 界面 的 右 下 角 ， 如 图 1-12 所 示 。 通 过 该 窗口 可 以 查看 和 编辑 项 目 、 
文件 、 控 件 和 页 面 本 身 的 属性 以 及 其 他 更 多 内 容 。 
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图 1-11 “解决 方案 资源 管理 器 ”窗口 图 1-12 “属性 ”窗口 


6. 文档 窗口 


文档 窗口 是 界面 的 主要 区 域 ， 大 部 分 动作 都 是 在 这 里 发 生 的 。 在 文档 窗口 的 下 面 ， 有 
3 个 视图 按钮 : “设计 ”、“ 拆 分 ”和 “ 源 ”。 在 操作 含有 标记 的 文件 (如 ASPX 和 HTML 
文件 ) 时 ， 这 些 按钮 会 自动 出 现 。 单 击 “ 设 计 ” 按 钮 可 以 打开 页 面 的 设计 视图 窗口 ， 在 这 里 
可 以 看 到 页 面 在 浏览 器 中 的 效果 ， 单 击 “ 拆 分 ”按钮 ， 窗 口 将 一 分 为 二 ， 同 时 打开 设计 和 
源 视 图 ， 单 击 “ 源 ”按钮 打开 源 视图 ， 在 此 可 以 看 到 页 面 的 源 代码 文件 。 

技巧 : 

默认 情况 下 ， 文 档 窗口 是 一 个 带 选 项 卡 的 窗口 ， 各 文件 之 间 通 过 选项 卡 分 隔 ， 文 件 名 
在 窗口 的 顶部 。 如 果 选 项 卡 上 的 文件 名 带 有 “*”， 则 说 明 该 文件 内 容 修 改过 但 还 没有 保存 。 


可 视 化 的 VWD 大 大 增加 了 文档 窗口 中 文本 显示 方式 的 灵活 性 。 读 者 可 以 修改 一 些 属 
性 ， 如 字体 大 小 、 字 体 颜 色 ， 甚 至 是 文本 的 背景 色 。 选 择 “ 工 具 ”|“ 选 项 ”命令 ， 可 以 打 
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开 “ 选 项 ”对 话 框 ， 如 图 1-13 所 示 。 
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图 1-13 “选项 ”对 话 框 
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在 “常规 ”选项 页 中 可 以 设置 “起 始 页 位 置 ”、“ 源 视图 ”和 制 表 符 大 小 等 。 在 “ 字 
体 和 颜色 ”选项 页 中 可 以 设置 文字 的 字体 、 大 小 和 颜色 等 。 

如 果 选 中 下 方 的 “显示 所 有 设置 ” 复 选 框 ， 还 可 以 设置 “环境 ”、“ 项 目 和 解决 方案 ” 
“调试 ”等 选项 ， 如 图 1-14 所 示 。 
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图 1-14 显示 所 有 设置 的 “选项 ”对 话 框 


7. 其 他 窗口 


除了 上 面 介绍 的 窗口 之 外 , VWD 2010 还 有 很 多 其 他 的 窗口 , 包括 “输出 ”窗口 、“ 错 
误 列 表 ” 窗 口 、“ 书 签 ”窗口 和 “查询 结果 ”窗口 等 。 这 些 窗口 都 可 以 通过 “视图 ”菜单 
下 面 的 相应 命令 打开 。 


1.3.2 第 一 个 ASPNET 应 用 程序 


本 节 将 通过 VWD 2010 创建 第 一 个 ASPNET Web 应 用 程序 .通过 这 个 Web 应 用 程序 ， 
读者 将 学 会 如 何 使 用 VWD 2010 创建 Web 应 用 程序 ， 并 对 在 浏览 器 中 浏览 ASP.NET 页 面 
时 后 台 的 工作 有 一 个 很 好 的 了 解 。 

1. 新 建 网 站 


例 1-1: 通过 VWD 2010 新 建 网 站 ， 了 解 通过 VWD 2010 开发 Web 应 用 程序 的 步骤 。 

(1) 通过 “开始 ”菜单 启动 VWD 2010， 选 择 “ 文 件 ”|“ 新 建 网 站 ”命令 ,打开 “新 
建 网 站 ”对 话 框 。 

(2) 选择 “ASP.NET 空 网 站 ”模板 ， 在 “Web 位 置 ” 下 拉 列 表 中 选择 “文件 系统 ” 选 
项 ， 然 后 在 后 面 的 文本 框 中 输入 存储 位 置 ， 存 储 位 置 的 最 后 是 网 站 名 “Chapterl ”， 单 击 
“确定 ”按钮 即 可 创建 一 个 空 网 站 Chapter 。 通 常情 况 下 ， 系 统 会 为 新 建 网 站 创建 一 个 新 
的 子 目 录 。 

新 建 的 空 网 站 只 有 一 个 名 为 web.config 的 配置 文件 。 下 面 将 添加 一 个 Web 窗 体 。 

(3) 在 “解决 方案 资源 管理 器 ”窗口 中 右 击 解 决 方案 ， 从 弹出 的 快捷 菜单 中 选择 “ 添 
加 新 项 ”命令 ， 打开“ 添加 新 项 ”对 话 框 ， 如 图 1-15 所 示 。 

选择 “Web 窗 体 ” 模 板 ， 默 认 文件 名 为 Default.aspx， 单 击 “ 添 加 ”按钮 即 可 。 
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图 1-15 “添加 新 项 ”对 话 框 


说 明 : 
一 个 完整 的 ASPNET 页 面 文档 通常 是 由 指令 、 文 档 类 型 声明 、 代 码 声 明 、 服 务 器 代码 、 
文本 和 XHTML 标记 等 部 分 组 成 。 现 在 ， 读 者 不 必 深 入 了 解 这些 ， 下 一 节 将 进行 详细 介绍 。 


(4) 在 Defaute.aspx 页 面 的 “ 源 ” 视 图 窗口 中 ， 修 改 页 面 的 代码 如 下 所 示 : 


<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" 
Inherits=" Default" %> 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http:/www.w1.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w1.org/1999/xhtml"> 
<head runat="server"> 
<title> 我 的 第 一 个 ASP.NET 页 面 </title> 
</head> 
<body> 
<h2> 从 今天 开始 学 习 ASP.NET 4 </h2> 
<form id="form1" runat="server"> 
<div> 
欢迎 使 用 VWD 2010， 现 在 时 间 是 : <% =System.DateTime Now %> 
</div> 
</form> 
</body> 
</html> 


读者 可 能 还 不 完全 熟悉 所 有 的 代码 ， 但 是 不 难 猜 出 它 是 用 来 输出 当前 日 期 和 时 间 的 。 
(5) 选择 “调试 " |“ 启动 调试 ”命令 ， 或 者 按 F5 键 ， 或 单 击 工具 栏 中 的 | 按钮 ， 将 编 
译 并 生成 网 站 ， 同 时 启动 调试。 
(6) 如 果 代码 输入 正常 ， 主 窗口 下 方 的 “输出 ”窗口 中 将 出 现 生成 成 功 的 信息 ， 如 图 
1-16 所 示 。 如 果 有 语法 错误 ， 则 在 “错误 列表 ”中 将 逐一 列 出 所 有 错误 ， 双 击 相应 的 错误 
将 跳 转 到 相应 的 代码 行 。 
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(7) 此 时 将 弹出 “未 启用 调试 ”对 话 框 ， 如 图 1-17 所 示 ， 如 果 选 择 “修改 Web.config 
文件 以 启用 调试 ” 单 选 按钮 ， 则 以 后 启动 该 工程 时 将 不 再 弹出 该 对 话 框 ， 而 是 默认 启动 调 
试 ， 如 果 选 择 “ 不 进行 调试 直接 运行 ” 单 选 按钮 ， 则 不 启动 调试 ， 等 同 于 用 户 按 Ctrl+F5 


EES... A X | 


Fenn Yeb. config 文件 中 局 用 调试 ， 因 此 无 法 在 调试 模式 下 运行 该 页 。 悠 希望 做 什 


已 局 动 生成 : 项 目 : E:\...\Chapterl\， 配 置 : Debus Aia] © Pi 
正在 验证 网 站 
正在 生成 目录 “/chapter1/” E 二 应 在 Web. config 文件 中 禁用 调试 。 


人 〇 不 进行 调试 直接 运行 G). (等 同 于 Ctrl+F5) 
“= [ me J[ m J 
图 1-16 “输出 ”窗口 图 1-17 “未 启用 调试 ”对 话 框 


(8) 单 击 “ 确 定 ” 按 钮 后 , 将 自动 启动 默认 的 Web 浏览 器 , 同时 打开 该 页 面 , 如 图 1-18 


(9) 此 时 ， 在 Windows 的 任务 栏 中 会 出 现 一 个 带 屏幕 提示 的 小 图 标明 ， 这 个 图 标 属 于 
ASPNET Development Server。 该 Web Re VWD 自动 启动 ， 以 响应 对 页 面 的 请 求 。 


双击 该 图 标 将 打开 如 图 1-19 所 示 的 详细 信息 。 
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图 1-18 页 面 运行 效果 图 1-19 ASP.NET Development Server 
2. 工作 原理 


虽然 本 例 中 创建 的 Web 站 点 非常 简单 ， 但 是 让 Default.aspx 页 面 显示 在 浏览 器 中 的 过 
程 却 没有 那么 简单 。ASP.NET 页 面 (根据 它 的 扩展 名 ， 也 称 为 ASPX 页 面 ) 本 身 并 不 能 做 太 
多 的 事 。 在 浏览 器 能 够 显示 它 之 前 ， 需 要 一 个 Web 服务 器 对 它 进 行 处 理 。 这 就 是 VWD 启 
动 内 置 的 ASP.NET Development Server 来 处 理 页 面 请 求 的 原因 。 接 下 来 ， 它 会 启动 默认 的 
Web 浏览 器 并 定向 到 本 例 中 的 Web 服务 器 地 址 : http://localhost:46312/Chapterl/Default.aspx。 


注意 : 
每 次 启动 Web 服务 器 时 地 址 中 的 端口 号 可 能 会 不 同 , 因为 该 端口 是 VWD 随机 选择 的 。 


当 在 浏览 器 中 请 求 一 个 ASPX 页 面 时 ，Web 服务 器 就 会 处 理 该 页 面 ， 执 行 它 在 文件 中 
找到 的 所 有 代码 ， 并 有 效 地 将 ASP.NET 标记 转换 为 纯 HIML， 然 后 发 送 回 客户 端 浏览 
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要 查看 最 终 的 HTML 与 原始 的 ASPX 页 面 的 区 别 , 可 以 在 浏览 器 中 打开 该 页 面 的 源 代 
码 。 选 择 “ 查 看 ”|“ 源 文件 ”命令 ， 将 会 打开 一 个 默认 的 文本 编辑 器 ， 用 于 显示 该 页 面 的 
HTML 代码 。 其 中 的 大 部 分 HTML 与 原始 的 ASPX 页 面相 似 。 然而， 如 果 看 一 下 显示 欢迎 
消息 和 当前 日 期 与 时 间 的 那 一 行 代 码 ， 就 会 注意 到 它们 有 很 大 的 区 别 。 除 了 显示 日 期 和 时 
间 的 代码 行 不 同 以 外 ， 还 多 了 一 个 隐藏 字段 VIEWSTATE， 如 下 所 示 ， 该 字段 表示 视图 状 
态 ， 第 2 章 将 详细 介绍 视图 状态 的 使 用 。 


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http'//www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head><title> 
我 的 第 一 个 ASP.NET 页 面 
</title></head> 
<body> 
<h2> 从 今天 开始 学 习 ASP.NET 4</h2> 
<form method="post" action="Default.aspx" id="form1"> 
<div class="aspNetHidden"> 
<input type="hidden" name=" VIEWSTATE'" id=" VIEWSTATE" 
value="/wWEPDwUJOTU4MjMyMzI1ZGSyc+0lwimxfCCOZ5aiaicW5fnSy47rkrINaHITC1PIJQ==" /> 
</div> 
<div> 
欢迎 使 用 VWD 2010， 现 在 时 间 是 : 2012-3-2 20:24:18 
</div> 
</form> 
</body> 
</html> 


1.3.3 ASP.NET 页 面 文档 的 结构 


-个 完整 的 ASP.NET 页 面 文档 通常 是 由 指令 、 文 档 类 型 声明 、 代 码 声明 、 服 务 器 代 
码 、 文 本 和 XHTML 标记 等 部 分 组 成 。 


1. 指令 


ASP.NET 页 面 通常 包含 一 些 指令 ， 允 许 用 户 指定 页 面 的 属性 和 配置 信息 ， 对 页 面 进行 
设置 ， 指 令 指定 的 设置 不 会 出 现在 浏览 器 端 。 

如 在 例 1-1 中 Default.aspx 页 面 的 第 一 行 就 是 Page 指令 ,该 指令 指出 使 用 的 语言 是 CH, 
后 台 代码 文件 是 “Defaultaspx.cs”， 该 页 面 对 应 的 后 台 类 是 _ Default。 


<%(@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" 
Inherits=" Default" %> 


ASP.NET 的 页 面包 含 两 个 部 分 : 一 部 分 是 可 视 化 元 素 ， 包括 标签 、 服 务 器 控件 以 及 一 
些 静 态 文本 等 ; 男 一 部 分 是 页 面 的 程序 逻辑 , 包括 事件 处 理 句 柄 和 其 他 程序 代码 。 ASP.NET 
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提供 两 种 模式 来 组 织 页 面 元 素 和 代码 : 一 种 是 单一 文件 模式 ， 另 一 种 是 后 台 代码 模式 。 


注意 : 
单一 文件 模式 和 后 台 代码 模式 功能 是 一 样 的 ， 可 以 在 两 种 模式 中 使 用 同样 的 控件 和 代 
码 ， 但 要 注意 使 用 的 方式 不 同 。 


2: 


在 单一 文件 模式 下 ， 页 面 的 标签 和 代码 在 同一 个 .aspx 文件 中 ， 程 序 代 码 包含 在 
<script runat=-"server"></scripft 的 服务 器 程序 脚本 代码 块 中 间 ， 并 且 代码 中 间 可 以 
实现 对 一 些 方法 和 属性 以 及 其 他 代码 的 定义 , 只 要 在 类 文件 中 可 以 使 用 的 都 可 以 在 
此 处 进行 定义 。 运 行 时 ， 单 一 页 面 被 视 为 继承 Page 类 。 

后 台 代 码 模式 将 可 视 化 元 素 和 程序 代码 分 别 放 在 不 同 的 文件 中 , 如 果 使 用 C# 语 言 ， 
则 可 视 化 页 面 元 素 为 .aspx 文件 ， 程 序 代码 为 .cs 文件 ， 根 据 使 用 语言 的 不 同 ， 代 码 
后 级 也 不 同 ， 这 种 模式 也 被 称 为 代码 分 离 模 式 。 

文档 类 型 声明 DOCTYPE 


文档 类 型 声明 DOCTYPE 用 于 指定 文档 遵从 的 DTD(Document Type Definition， 文 档 
类 型 定义 ) 标 准 ， 同 时 指定 了 文档 的 XHTML 版 本 ， 可 以 和 哪些 验证 工具 一 起 使 用 等 信息 ， 
以 保证 此 文档 与 Web 标准 一 致 。 

例如 ， 例 1-1 中 页 面 的 文档 类 型 声明 如 下 : 


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 


"http'//www.w1.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 


其 中 ， 各 部 分 的 含义 如 下 。 


3. 


DOCTYPE 是 document type( 文 档 类 型 ) 的 缩写 。 

W3C//DTD XHTML 1.0 Transitional 说 明 此 文档 符合 W3C 制定 的 XHTML 1.0 规 范 ， 
即 声明 此 文档 应 该 按照 XML 文档 规范 来 配对 所 有 标记 。 

xhtmll-transitional.dtd 中 的 DTD 是 文档 类 型 定义 , 包含 了 文档 的 规则 , 浏览 器 根据 
页 面 所 定义 的 DTD 来 解释 页 面 内 的 标识 ， 并 将 其 显示 出 来 。 

代码 声明 


代码 声明 包含 了 ASP.NET 页 面 的 所 有 应 用 迪 辑 和 全 局 变量 声明 、 子 例 程 和 函数 。 页 


面 的 代码 声明 位 于 <scrip 亿 .…</scrip 人 标记 中 。 内 联 代码 位 于 <%.…%> 中 ， 如 例 1-1 中 输出 当 


lk 


前 时 间 的 代码 : <% =System.DateTime.Now %> 


4. 


服务 器 代码 


大 多 数 ASP.NET 页 面 都 包含 处 理 页 面 时 在 服务 器 上 运行 的 代码 。 页 面 的 代码 位 于 
script 标记 中 ， 并 且 该 标记 包含 mnat="server" 属 性 ， 说 明 页 面 运 行 时 ， 将 标记 标识 为 服务 
器 控件 ， 并 使 其 可 用 于 服务 器 代码 。 


5. 


文本 和 XHTML 标记 


页 面 的 文本 部 分 用 XHTML 标记 来 实现 ， 这 一 部 分 结构 应 完全 符合 HTML 文件 结构 。 
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本 章 介绍 了 网 站 建设 相关 的 基础 知识 ， 以 及 ASPNET 4.0 与 VWD 2010 初步 介绍 。 首 
先 ， 介 绍 了 HTML、 静 态 网 站 和 动态 网 站 的 基本 概念 。 接 着 介绍 了 ASP.NET 的 发 展 史 及 


其 工作 


如 何 使 用 VWD 2010 开发 ASP.NET Web 应 用 程序 。 本 章 内 容 是 全 书 的 基础 ， 下 一 章 将 习 
点 介绍 ASP.NET 的 内 置 对 象 。 


m £ VNE 


原理 ，VWD 2010 的 获取 与 安装 。 最 后 ， 介 绍 了 VWD 2010 的 集成 开发 环境 ， 以 及 


1.5 思考 和 练习 


. HTML 与 XHTML 有 何 区 别 。 两 者 有 什么 关系 ? 

参照 本 章 内 容 ， 获 取 VWD 2010 并 安装 。 

简 述 ASP.NET 的 工作 原理 。 

. 如 何 设置 文档 窗口 中 制 表 符 的 大 小 ? 

上 机 操作 :新 建 一 个 网 站 ， 添 加 一 个 ASP.NET 页 面 ， 并 显示 当前 时 间 。 


E 
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本 章 主要 介绍 ASP.NET 的 一 些 基 础 知识 ， 学 习 和 掌握 这 些 知 识 是 以 后 进行 ASP.NET 
程序 开发 的 基础 和 前 提 。 主要 包括 ASP.NET 的 文件 类 型 和 应 用 程序 的 目录 结构 , ASP.NET 
的 内 置 对 象 以 及 ASP.NET 的 配置 文件 web.config 和 全 局 文件 Global.asax。 本 章 是 学 习 
ASP.NET 非常 关键 的 一 章 ， 是 从 认识 了 解 到 使 用 ASP.NET 的 一 个 关键 点 。 

本 章 学 习 目 标 : 

° THE ASP.NET 的 文件 类 型 
掌握 Page 类 和 窗 体 页 指令 
使 用 ASP.NET 内 置 对 象 
网 页 的 重 定向 
掌握 Cookie 的 使 用 、 设 置 以 及 修改 的 方法 
视图 状态 的 使 用 和 关闭 
在 web.config 中 创建 用 户 变量 
Global.asax 文件 的 作用 


2.1 ASP.NET 应 用 程序 概述 


ASP.NET 应 用 程序 与 传统 的 桌面 型 应 用 程序 不 同 。 传统 的 桌面 型 应 用 程序 是 一 个 独立 
的 exe 文件 ， 而 ASP.NET 应 用 程序 则 总 是 被 分 成 若干 个 Web 页面 。 这 样 ， 用 户 就 可 以 从 
不 同 的 入 口 进 入 不 同 的 ASP.NET 应 用 程序 ， 或 者 跟随 超 链 接 从 一 个 Web 应 用 程序 导航 到 
另 一 个 Web 应 用 程序 。 

每 个 ASPNET 应 用 程序 都 共享 一 组 资源 和 配置 设置 。 另 一 个 ASPNET 应 用 程序 则 不 
能 共享 这 些 资 源 和 配置 ， 即使 它们 位 于 同一 个 Web 服务 器 上 。 从 技术 的 角度 来 讲 , 每 一 个 
ASP.NET 应 用 程序 都 在 一 个 独立 的 “应 用 程序 域 ”(application domain) 中 执行 。 

如 图 2-1 所 示 是 一 个 Web 服务 器 的 应 用 程序 域 的 结构 ， 其 中 包含 了 两 个 独立 的 Web 
应 用 程序 。 

说 明 : 

应 用 程序 域 是 内 存 中 相互 隔离 的 内 存 区 域 ， 这 使 得 当 一 个 Web 应 用 程序 出 现 故 障 时 ， 
并 不 会 影响 到 另 一 个 Web 应 用 程序 。 
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IIS Web 服务 器 


应 用 程序 域 应 用 程序 域 


Web 页 面 | 配置 文件 [venm 配置 文件 
应 用 程序 和 应 用 程序 和 


图 2-1 ASPNET 应 用 程序 域 


2.1.1 ASPNET 的 文件 类 型 


ASP.NET 应 用 程序 可 以 包含 很 多 种 不 同类 型 的 文件 , 而 不 同类 型 的 文件 提供 了 不 同 的 
功能 。 在 “添加 新 项 ”对 话 框 中 包含 了 允许 向 Web 站 点 中 添加 的 文件 类 型 。 这 些 能 够 添加 
到 站 点 中 的 文件 可 以 分 组 到 不 同 的 类 别 中 。 下 面 将 讨论 其 中 最 重要 的 文件 。 

1. Web 文件 

Web 文件 是 Web 应 用 程序 中 特有 的 文件 ， 可 以 由 浏览 器 直接 请 求 ， 也 可 以 用 来 构建 
在 浏览 器 中 请 求 的 Web 页 面 的 一 部 分 。 如 表 2-1 所 示 为 各 种 Web 文件 的 扩展 名 及 其 描述 。 


表 2-1 ASP.NET Web 文件 类 型 


文件 类 型 描述 
aspx 文件 是 ASPNET 的 Web 页 面 文件 ， 与 传统 ASP 应 用 程序 中 的 .asp 文件 
. 对 应 。.aspx 文件 中 包含 页 面 的 用 户 界 面 ， 也 可 以 包含 一 些 基本 的 应 用 程序 代 
Apea 码 。 用 户 向 Web 服务 器 请 求 某 个 .aspx 文件 ， 或 者 导航 到 某 个 .aspx 文件 时 ， 
将 进入 一 个 Web 应 用 程序 
.ascx 文件 是 ASP.NET 的 用 户 控件 。 用 户 控件 与 Web 页 面 类 似 ， 但 用 户 无 法 
.. 直接 访问 .ascx 文件 。 实 际 上 ，.ascx 文件 必须 嵌入 到 一 个 ASP.NET 页 面 中 才 
We 能 运行 。 可 以 使 用 用 户 控件 来 开发 一 些 用 户 界面 的 模块 ， 并 在 其 他 页 面 中 直 
接 使 用 这 些 用 户 控件 ， 而 不 必 重 复 编写 相同 的 代码 
-master 文件 master 文件 是 母 版 页 文件 ， 这 些 文件 允许 定义 Web 站 点 的 全 局 结构 和 外 观 
.htm/.html 文件 可 用 来 显示 Web 站 点 中 的 静态 HTML 
.css 文件 层 芭 样式 表 文 件 ， 包 含 允 许 定制 Web 站 点 的 样式 和 格式 的 CSS 代码 
web.config 文件 是 一 个 基于 XML 的 ASPNET 配置 文件 。 该 配置 文件 包含 
web.config 文件 自 定义 的 安全 设置 、 状 态 管 理 和 内 存 管理 等 多 种 配置 的 设置 。 本 书 中 很 多 地 
方 都 会 用 得 该 文件 的 配置 
. 站 点 导航 文件 ,包含 一 个 层次 结构 ， 表 示 站 点 中 XML 格式 的 文件 ， 用 于 导航 
.sitemap 文件 控件 
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GER) 
文件 类 型 描述 
"P. Jscript 文件 ， 包 含 可 以 在 客户 端 浏览 器 中 执行 的 JavaScript(Microsoft 称 之 为 
et JScript 
.skin 文件 外 观 文件 ， 包 含 Web 站 点 中 的 控件 设计 信息 
2. 代码 文件 


ASPNET 的 代码 文件 如 表 2-2 所 示 。 


表 2-2 ASP.NET 代码 文件 类 型 


文件 类 型 描 g 
.asmx 文件 是 ASP.NET Web 服务 文件 。Web 服务 是 一 组 方法 的 集合 ， 这 些 方 
.asmx 文件 


法 可 以 通过 Internet 进行 调用 。 其 工作 原理 与 Web 页 面 完 全 不 同 ， 但 是 Web 
服务 与 Web 页 面 共享 同一 应 用 程序 中 的 各 种 资源 、 配 置 设置 和 内 存 区 域 
Globalasax 文件 是 一 个 全 局 应 用 程序 文件 。 在 Global.asax 文件 中 ， 可 以 定义 
全 局 变量 (全 局 变量 可 以 在 当前 Web 应 用 程序 的 所 有 页 面 中 访问 )， 也 可 以 定 
义 应 用 程序 的 全 局 事件 (如 当 一 个 Web 应 用 程序 启动 时 的 事件 ) 

.cs 文件 是 Web 页 面 的 后 置 代码 文件 ， 其 中 包含 执行 页 面 逻辑 功能 的 CHR 


Global.asax 文件 


.cs 文件 
人 码 。.cs 文件 将 应 用 程序 的 逻辑 从 Web 页 面 的 用 户 界面 中 分 离 出 来 
注意 : 


如 果 使 用 的 是 Visual Basic.NET 语言 ， 则 对 应 的 后 置 代码 文件 扩展 名 是 .vb。 


3. 数据 文件 


数据 文件 用 来 存储 可 以 用 在 站 点 和 其 他 应 用 程序 中 的 数据 。 这 组 文件 由 XML 文件 、 
数据 库 文 件 以 及 与 使 用 数据 相关 的 文件 组 成 ， 如 表 2-3 所 示 。 


表 2-3 ASP.NET 数据 文件 类 型 


文件 类 型 fe — Ë 

misk xml 文件 用 来 存储 XML 格式 的 数据 。 除 了 纯 XML 文件 外 ，ASP.NET 还 支持 几 
种 基于 XML 的 文件 ， 其 中 包括 前 面 提 到 的 web.config 和 Site Map 文件 

mdf 文件 mdf 文件 是 Microsoft SQL Server 使 用 的 数据 库 文 件 
-dbml 文件 用 于 声明 性 地 访问 数据 库 ， 不 需要 写 代 码 。 从 技术 上 来 讲 ， 这 并 不 是 

.dbml 文件 -个 数据 文件 ， 因 为 它 不 包含 实际 数据 。 然 而 ， 由 于 它们 与 数据 库 绑 定 得 如 此 紧 
密 ， 因 此 把 它们 归 组 在 这 个 标题 下 是 有 意义 的 


waw ASPNET 4.0 网 站 开发 实例 教程 


2.1.2 ASPNET 应 用 程序 的 目录 结构 


每 个 Web 应 用 程序 都 应 该 具有 一 个 良好 的 目录 结构 规划 。 开 发 者 在 对 程序 进行 设计 时 
应 该 将 特定 类 型 的 文件 存放 在 某 些 文件 夹 中 ， 以 方便 在 今后 开发 中 的 管理 和 操作 o 
ASP.NET 保留 了 一 些 特殊 的 子 目 录 , 程序 开发 人 员 可 以 直接 使 用 , 并且 还 可 以 在 应 用 程序 
中 增加 任意 多 个 文件 和 文件 夹 。 

1. App_Code 子 目 录 


App_Code 子 目录 在 Web 应 用 程序 根 目录 下 ， 它 存储 所 有 应 当 作为 应 用 程序 的 一 部 分 
动态 编译 的 类 文件 。 这 些 类 文件 自动 链接 到 应 用 程序 ， 而 不 需要 在 页 面 中 添加 任何 显 式 指 
令 或 声明 来 创建 依赖 性 。App_Code 目录 中 放置 的 类 文件 可 以 包含 任何 可 识别 的 ASPNET 
组 件 ， 包 括 自 定义 控件 、 辅 助 类 、build 提供 程序 、 业 务 类 、 自 定义 提供 程序 和 HTTP 处 理 

在 开发 时 ,对 App_Code 目录 的 更 改 会 导致 整个 应 用 程序 的 重新 编译 。 对 于 大 型 项 目 ， 
这 可 能 不 受 欢迎 ， 而 且 很 耗 时 。 为 此 ， 鼓 励 大 家 将 代码 进行 模块 化 处 理 到 不 同 的 类 库 中 ， 
按 逻 辑 上 相关 的 类 集合 进行 组 织 。 应 用 程序 专用 的 辅助 类 大 多 放置 在 App_Code 文件 夹 中 。 


注意 : 

App Code 目录 中 存放 的 所 有 类 文件 应 当 使 用 相同 的 语言 。 如 果 类 文件 使 用 两 种 或 多 
种 语言 编写 ， 则 必须 创建 特定 语言 的 子 目录 ， 以 包含 用 各 种 语言 编写 的 类 。 一 旦 根据 语言 
组 织 这 些 类 文件 ， 就 要 在 web.config 文件 中 为 每 个 子 目 录 添 加 设置 ， 有 关 web.config 文件 
的 使 用 将 在 后 面 进行 详细 介绍 。 


2. App_Data fE Z: 


App_Data 子 目录 保存 应 用 程序 使 用 的 数据 库 。 它 是 一 个 集中 存储 应 用 程序 所 用 数据 库 
的 地 方 。 该 目录 是 ASP.NET 为 程序 提供 存储 自身 数据 的 默认 位 置 ， 但 该 文件 夹 内 容 不 由 
ASP.NET 处 理 。 它 通常 以 文件 (诸如 Microsoft Access 或 Microsoft SQL Server 数据 库 、XML 
文件 、 文 本 文件 以 及 应 用 程序 支持 的 任何 其 他 文件 ) 的 形式 对 数据 进行 存储 。 

当然 ， 也 可 以 将 数据 文件 保存 到 其 他 目录 中 。 

提示 : 

默认 情况 下 ，ASPNET 账户 被 授予 对 该 子 目 录 的 完全 访问 权限 。 如 果 要 改变 ASP.NET 
账户 ， 一 定 要 确保 新 账户 被 授予 对 该 目录 的 读 、 写 访问 权 。 


3. Bin 子 目 录 


Bin 子 目 录 包 含 应 用 程序 所 需 的 用 于 控件 、 组 件 或 需要 引用 的 任何 其 他 代码 的 可 部 署 
程序 集 。 该 目录 中 存在 的 任何 .dl 文件 将 自动 链接 到 应 用 程序 。 可 以 在 Bin 目录 中 存储 编 
译 的 程序 集 , 并且 在 Web 应 用 程序 任意 处 的 其 他 代码 会 自动 引用 该 目录 。 例 如 : WRA A 
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定义 类 编译 好 了 代码 ， 那 么 就 可 以 将 编译 后 的 程序 集 复 制 到 Web 应 用 程序 的 Bin 目录 中 ， 
这 样 ， 所 有 页 就 都 可 以 使 用 这 个 类 了 。 

Bin 目录 中 的 程序 集 无 须 注册 。 只 要 .dll 文件 位 于 Bin 目录 中 ,ASP.NET 就 可 以 识别 它 。 
如 果 更 改 了 .dl 文件 , 并 将 它 的 新 版 本 写 入 到 了 Bin ARF, 则 ASP.NET 也 会 检测 到 更 新 ， 
对 随后 的 新 页 请 求 使 用 新 版 本 的 .dl 文件。 

Bin 目录 中 程序 集 的 作用 范围 为 当前 应 用 程序 。 因 此 ， 它 们 无 法 访问 当前 Web 应 用 程 
序 之 外 的 资源 或 调用 当前 Web 应 用 程序 之 外 的 代码 。 此 外 , 在 运行 时 ， 程 序 集 的 访问 级 别 
由 本 地 计算 机 上 指定 的 信任 级 别 确定 。 

App_Code 子 目 录 和 Bin 子 目 录 是 ASP.NET 网 站 中 的 共享 代码 文件 夹 , 如 果 Web 应 用 
程序 要 在 多 个 页 之 间 共 享 代码 , 就 可 以 将 代码 保存 在 Web 应 用 程序 根 目录 下 的 这 两 个 特殊 
目录 中 。 当 创建 这 些 子 目录 并 在 其 中 存储 特定 类 型 的 文件 时 ，ASP.NET 将 使 用 特殊 方式 
处 理 。 

4. App_GlobalResources 子 目 录 


App_GlobalResources 子 目录 用 于 保存 Web 应 用 程序 中 的 全 局 资源 文件 ， 资 源 文件 是 
- 些 字符 串 表 ， 当 应 用 程序 需要 根据 某 些 事情 进行 修改 时 ， 资 源 文 件 可 用 于 这 些 应 用 程序 

的 数据 字典 。 可 以 在 App_GlobalResources 子 日 录 中 添加 程序 集资 源 文件 (.resx)， 它 们 会 动 
态 编译 , 成 为 解决 方案 的 一 部 分 , 供 程 序 中 的 所 有 .aspx 页 面 使 用 。 在 使 用 ASP.NET 2.0/2.1 
时 ， 必 须 使 用 resgen.exe 工具 把 资源 文件 编译 为 .dll 或 .exe， 才 能 在 解决 方案 中 使 用 。 而 从 
ASP.NET 3.5 开始 ， 资 源 文件 的 处 理 就 容易 多 了 。 除 了 字符 串 之 外 ， 还 可 以 在 资源 文件 中 
添加 图 像 和 其 他 文件 。 

当 需 要 开发 一 个 支持 多 种 语言 的 Web 网 站 时 ， 该 目录 用 于 进行 本 地 化 设置 。 

5. App_LocalResources 子 目 录 


App_GlobalResources 子 目录 用 于 合并 可 以 在 应 用 程序 范围 内 使 用 的 资源 。 如 果 对 构造 
应 用 程序 范围 内 的 资源 不 感 兴趣 ， 而 对 只 能 用 于 一 个 .aspx 页 面 的 资源 感 兴趣 , 就 可 以 使 用 
该 目录 。 可 以 把 专用 于 页 面 的 资源 文件 添加 到 该 目录 中 ， 方 法 是 构建 .resx 文件 名 ， 如 下 
所 示 : 


Default.aspx resx 
Default.aspx.fi.resx 
Default.aspx.ja.resx 
Default.aspx.en-gb.resx 
这 样 ， 就 可 以 从 App_LocalResources 目录 中 的 相应 文件 中 检索 在 Default.aspx 页 面 上 
使 用 的 资源 声明 。 如 果 没 有 找到 匹配 的 资源 ， 将 默认 使 用 Default aspx.resx 资源 文件 。 
6. App_WebReferences 子 目录 


App_WebReferences 子 目录 用 于 保存 当前 Web 应 用 程序 中 用 到 的 Web 服务 引用 。 
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7. App_Themes 子 目录 


App_Themes 子 目 录用 于 存放 Web 应 用 程序 中 使 用 的 主题 。 主 题 是 为 站 点 上 的 每 个 页 
面 提供 统一 外 观 和 操作 方式 的 一 种 新 方法 。 通 过 skin 文件 、CSS 文件 和 站 点 上 服务 器 控件 
使 用 的 图 像 来 实现 主题 功能 。 所 有 这 些 元 素 都 可 以 构建 一 个 主题 ， 并 存储 在 解决 方案 的 
App_Themes 目录 中 。 
当 用 户 试图 将 一 个 文件 添加 到 它 的 特色 文件 夹 之 外 时 ，VWD 就 会 发 出 警告 ， 并 询问 
户 是 否 创建 特色 文件 夹 并 将 文件 放 在 其 中 。 如 图 2-2 所 示 ， 是 试图 在 Web 站 点 的 根 目录 
中 添加 一 个 外 观 文件 时 弹出 的 提升 对 话 框 。 


r | 


Nicrosoft Visual Web Developer 2010 学 习 版 Ë 


IF; 件 类 型 主题 文件 ] ASP.NET 网 站 。 通 常 ， 要 在 网 站 中 使 用 此 类 型 的 项 应 将 其 放 在 “App_Themes” 文 件 来 
A FRERPSEDES one 


S. 


o C ze JC wa ) 


图 2-2 添加 特殊 文件 时 的 提示 对 话 框 
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ASP.NET 能 够 成 为 一 个 庞大 的 软件 体系 ， 与 它 提供 了 大 量 的 对 象 类 库 有 很 大 的 关系 。 
这 些 类 库 中 包含 许多 封装 好 的 内 置 对 象 ， 开 发 人 员 可 以 直接 使 用 这 些 对 象 的 方法 和 属性 。 
主要 包括 : Page, Response, Request, Application, Session, Server, ViewState 和 Cookie 
等 。 下 面 将 分 别 介绍 这 些 对 象 的 常用 方法 及 属性 。 


2.2.1 Page 类 与 Web 窗 体 页 指令 


在 ASP.NET Framework 中 ，Page 类 为 ASP.NET 应 用 程序 文件 所 构建 的 对 象 提供 基本 
行为 ,该 类 在 System.Web.UI 命名 空间 中 , 从 TemplateControl 类 派生 而 来 , 而 TemplateControl 
类 继承 自 System.Web.UI.Control， 它 也 是 一 种 特殊 的 Control 类 ， 并 实现 了 IHttpHandler 
接口 。 

1. Page 对 象 


Page 对 象 对 应 Web 窗 体 ， 主 要 用 来 设置 与 网 页 有 关 的 各 种 属性 、 方 法 和 事件 。Page 
对 象 充当 页 面 中 所 有 服务 器 控件 的 命名 容器 。 
在 页 面 工作 过 程 中 ， 每 个 页 面 都 被 编译 为 一 个 类 ， 当 有 请 求 的 时 候 就 会 对 这 个 类 进行 
实例 化 。 对 于 页 面 的 生存 周期 ，Page 对 象 一 共 要 关心 以 下 5 个 阶段 。 
e 页 面 初始 化 : 在 这 个 阶段 ， 页 面 及 其 控件 被 初始 化 ,页 面 确定 这 是 一 个 新 的 请 求 还 
是 一 个 回 传 请 求 。 页 面 事件 处 理 器 Page Prelnit 和 Page Init 被 调用 。 另 外 ， 所 有 服 
务 器 控件 的 Prelnit 和 Init 被 调用 。 
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e RA: 经 过 页 面 初 始 化 之 后 ， 页 面 将 进入 载 入 阶段 。 在 该 阶段 ， 如 果 当 前 页 面 的 请 
求 是 一 个 回 传 请 求 ， 则 该 页 面 将 从 视图 状态 和 控件 状态 中 加 载 控件 的 属性 。 在 此 过 
程 中 ， 页 面 将 引发 Load 事件 。 

e 回 送 事件 处 理 : 如 果 请 求 是 一 个 回 传 请 求 ， 任 何 控件 的 回 发 事件 处 理 过 程 都 将 被 
调用 。 

e 呈现 : 在 页 面 呈 现状 态 中 ， 视 图 状态 被 保存 到 页 面 。 页 面 和 控件 的 PreRender 和 
Render 方法 先后 被 调用 。 最 后 ， 呈 现 的 结果 通过 HTTP 响应 发 送 回 客户 端 。 

o HR: 对 页 面 使 用 过 的 资源 进行 最 后 的 清除 处 理 ， 控 件 或 页 面 的 Unload 方法 将 被 
调用 。 


说 明 : 

单一 页 面 在 运行 时 被 视 为 继承 Page 类 。 而 在 后 台 代码 模式 中 ， 后 台 的 .cs 文件 中 包含 
一 个 继承 在 Page 类 的 分 部 类 ， 即 具有 partial 关键 字 的 类 声明 ， 在 对 代码 分 离 页 进行 编译 
时 ，ASPNET 基于 ，aspx 文件 生成 一 个 分 部 类 ， 该 类 是 .cs 文件 中 定义 的 分 部 类 的 另 一 部 
分 ， 两 者 一 起 编译 成 程序 集 ， 运 行 该 程序 集 可 以 输出 程序 到 浏览 器 。 


Page 类 的 常用 属性 如 表 2-4 所 示 。 
3 2-4 Page 类 的 属性 
属 性 H g 
Application 只 读 属性 ， 为 当前 Web 请 求 获取 HttpApplicationState 对 象 
Cache 只 读 属性 ， 获 取 与 网 页 所 在 的 应 用 程序 相关 联 的 cache 对 象 
当前 网 页 结束 时 ， 是 否 要 保持 视图 状态 及 所 包含 的 服务 器 的 视图 状态 ， 默 认为 
EnableViewState 
True 
只 读 属 性 ， 指 示 该 页 是 否 正 为 响应 客户 端 回 发 而 加 载 ， 还 是 正 被 首次 加 载 和 
IsPostBack 
访问 
只 读 属性 ， 检 查 网 页 中 的 控件 是 否 全 部 验证 成 功 ， 全 部 验证 成 功 返 回 True, A 
则 返回 False 
Request 获取 请 求 的 页 的 HttpRequest 对 象 
Response 获取 与 该 Page 对 象 关联 的 HttpResponse 对 象 
Server 获取 Server 对 象 ， 它 是 HttpServerUtility 类 的 实例 
Session 获取 ASP.NET 提供 的 当前 Session 对 象 
Validators 获取 请 求 的 页 上 包含 的 全 部 验证 控件 的 集合 
ie 获取 状态 信息 的 字典 ， 这 些 信息 使 用 户 可 以 在 同一 页 的 多 个 请 求 间 保存 和 还 原 
服务 器 控件 的 视图 状态 


Page 类 的 主要 方法 和 事件 如 表 2-5 所 示 。 
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R25 Page 类 的 主要 方法 和 事件 


方法 或 事件 描 述 
DataBind 方法 将 数据 源 与 Web 上 的 服务 器 控件 进行 绑 定 
Dispose 方法 让 服务 器 控件 在 释放 内 存 前 执行 清理 工作 
FindControl 方法 在 Web 窗 体 上 搜索 标识 为 指定 id 的 服务 器 控件 
HasControl 方法 如 果 Page 对 象 中 包含 服务 器 控件 ， 则 返回 True， 否 则 返回 False 
MapPath 方法 将 虚拟 路 径 转 换 为 实际 路 径 
PreInit 事件 在 页 初始 化 开始 时 发 生 
PreLoad 事件 在 页 的 Load 事件 之 前 发 生 
Load 事件 当 服 务 器 控件 加 载 到 Page 对 象 中 时 发 生 
Init 事件 当 服 务 器 控件 初始 化 时 发 生 ， 初 始 化 是 控件 生存 期 的 第 一 步 
PreRender 事件 在 加 载 Control 对 象 之 后 、 呈 现 之 前 发 生 
InitComplete 事件 在 页 初始 化 完成 时 发 生 
LoadComplete 事件 在 页 生存 周期 的 加 载 阶 段 结束 时 发 生 
UnLoad 事件 当 服 务 器 控件 从 内 存 中 印 载 时 发 生 
DataBinding 事件 当 数 据 源 与 页 面 上 的 服务 器 控件 进行 绑 定时 发 生 


Page 对 象 的 事件 贯穿 页 面 执行 的 整个 过 程 。 大 多 数 情况 下 ， 只 需 关 心 Page_Load 事件 
即 可 。 由 于 Page Load 方法 会 在 每 次 页 面 被 加 载 时 执行 ， 所 以 ， 即 使 是 回 传 的 情况 下 也 会 
调用 该 方法 ， 此 时 ， 可 以 使 用 Page 对 象 的 IsPostBack 属性 来 判断 是 否 是 回 传 请 求 ， 从 而 进 
行 不 同 的 处 理 。 例 2-1 演示 了 Page 类 各 事件 发 生 的 时 刻 。 

例 2-1: 演示 加 载 页 面 时 ，Page 类 各 事件 的 发 生 顺 序 。 

(1) 启动 VWD2010， 选 择 “ 文 件 ” |“ 新 建 网 站 ”命令 ， 新 建 一 个 空 网 站 Chapter2， 单 
击 “ 确 定 ”按钮 。 

(2) 选择 “网 站 ”| 添加 新 项 ”命令 , 打开 “添加 新 项 ”对 话 框 , 添加 一 个 名 为 Default.aspx 
的 Web 窗 体 。 

G) 切换 到 页 面 的 “设计 ”视图 ， 从 “工具 箱 ” 中 拖 动 一 个 Button 控件 和 一 个 Label 
控件 到 Web 窗 体 中 ,系统 自动 为 它们 命名 为 Buttonl 和 Labell。 在 Button 控件 的 上 方 添加 
文本 信息 “Page 事件 演示 ”， 效 果 如 图 2-3 所 示 。 


技巧 : 
在 “工具 箱 ” 中 双击 相应 的 控件 ， 即 可 将 其 添加 到 Web 窗 体 中 。 


(4) 选中 Label 控件 ， 在 “属性 ”窗口 中 修改 其 Text 属性 为 “下 面 将 显示 各 事件 发 生 
的 顺序 ”。 
(5) 在 Web 窗 体 中 双击 Button 控件 ， 即 可 为 其 添加 单 击 事件 处 理 程序 ， 同 时 将 跳 转 到 
代码 文件 Default.aspx.cs 的 相应 位 置 ， 并 在 此 添加 如 下 代码 ,修改 Label 控件 的 Text 属性 。 
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protected void Button1_Click(object sender, EventArgs e) 


{ 
Label2.Text += "<br> 按 钮 的 单 击 事件 处 理 程序 ": 


技巧 ; 
也 可 以 选中 Button 控件 ， 然 后 在 “属性 ”窗口 中 单 击 工具 栏 中 的 “事件 ”按钮 | 多 | 
然后 从 事件 列表 中 找到 Click 事件 来 添加 其 事件 处 理 程序 ， 如 图 2-4 所 示 。 


DataBinding 


Disposed 
Init 

Load 
PreRender 
Inland 


Button 


Label] = 


已 设计 | 口 拆 分 | 回 源 arp Tatera. 


图 2-3 添加 控件 到 Web 窗 体 图 2-4 为 控件 添加 事件 处 理 程序 


(6) 在 代码 中 同时 添加 其 他 的 Page 对 象 的 事件 处 理 程序 ， 如 下 所 示 : 


protected void Page InitComplete(object sender, EventArgs e) 


{ 
Labell.Text += "<br>Page 对 象 的 InitComplete 事件 "; 
} 
protected void Page Prelnit(object sender, EventArgs e) 
{ 
Labell.Text += "<br>Page 对 象 的 PreInit 事件 "; 
} 
protected void Page Init(object sender, EventArgs e) 
{ 
Labell.Text += "<br>Page 对 象 的 Init 事件 "; 
protected void Page PreLoad(object sender, EventArgs e) 
t 
Labell.Text += "<br>Page 对 象 的 PreLoad 事件 "; 
} 
protected void Page Load(object sender, EventArgs e) 
{ 
Labell.Text += "<br>Page 对 象 的 Load FF"; 
} 


protected void Page PreRender(object sender, EventArgs e) 
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Labell.Text += "<br>Page 对 象 的 PreRender 事件 "; 
} 
protected void Page LoadComplete(object sender, EventArgs e) 
Í 
Labell.Text += "<br>Page 对 象 的 LoadComplete 事件 "; 
} 


(7) 编译 并 运行 程序 ， 或 者 按 F5 BË, 在 正中 显示 的 运行 效果 如 图 2-5 所 示 。 


OO "1 
Æ http://localhost:8125/Chapter2/De. - Jog Æ http://localhost:8125/Chapter2/De. .- Z mx] 
GO “e nem x ° Ə- e leeahest [y| +> X | @ 
XPO RED FEV KARW IAW MU XD SED SEV KARO IAV 帮助 0) 
ABR — @vwoy /nocubost:81 m a ABRA @ wo: /nocdhost:01 ü- 
Page 事 件 演示 Pgs 事件 江 示 r 
Button 
面 将 显示 各 事件 发 生 的 顺序 ENP 显示 名 事件 发 生 的 顺序 
Page 对 象 的 PreIni 事 件 Page 对 象 的 Prelnit 事 件 
Page 对 象 的 Ini 事 件 了 Page 对 象 的 In 事件 
了 Page 对象 的 InitComplete 事 件 了 Page 对象 的 InitComplete 事 件 
Page 对 象 的 PreLoad 事 件 page 对象 的 PreLoad 事 件 
page 对 象 的 Load 事 件 了 Page 对象 的 Load 事 件 
了 Page 对 象 的 LoadComplete 事 件 Page 对 象 的 LoadComplete 事 件 
Page 对 象 的 PreRender 事 件 Page 对 象 的 PreRender 事 件 
“ask Tapa maji 
ror 的 Load 事 件 
按钮 的 单 击 事件 处 理 程序 
了 Page 对象 的 LoadComplete 事 件 
了 Page 对 象 的 PreRender 事 件 x 
@ muat a 10 + im ao Aios ~ 


图 2-5 Page 对 象 演示 结果 


2. Web 窗 体 页 指令 


Web 窗 体 页 指令 也 称 为 预 编译 指令 ， 用 来 指定 当 请 求 ASP.NET 页 和 用 户 控 件 时 使 用 
的 设置 。 常 用 的 预 编译 指令 如 表 2-6 所 示 。 


R26 常用 的 窗 体 页 指令 


指令 Ho R 
R 该 指令 定义 ASP.NET 页 分 析 器 和 编译 器 使 用 的 页 的 特定 属性 ， 它 只 能 包含 
在 .aspx 文件 中 ， 且 每 个 .aspx 文件 中 只 能 有 一 个 @Page 指令 
该 指令 定义 ASP.NET 页 分 析 器 和 编译 器 使 用 的 用 户 控件 (.ascx 文件 ) 特 定 的 
@Control 属性 ， 它 只 能 包含 在 .ascx 文件 中 ， 且 每 个 .ascx 文件 中 只 能 有 一 个 @Control 
指令 
该 指令 在 编译 过 程 中 将 程序 集 链接 到 当前 页 ， 以 使 程序 集 的 所 有 类 和 接口 都 
(@Assembly I 
可 用 在 该 页 上 
@Implements 该 指令 指示 当前 页 或 用 户 控件 实现 指定 的 .NET 框架 接口 
该 指令 将 命名 空间 显示 导入 到 页 中 , 使 导入 的 命名 空间 的 所 有 类 和 接口 可 
@Import 于 该 页 ， 导 入 的 命名 空间 可 以 是 .NET 框架 类 库 或 用 户 定义 的 命名 空间 的 一 
部 分 
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( 续 表 ) 
指令 描述 
asas 该 指令 以 声明 的 方式 控制 ASP.NET 页 或 页 中 包含 的 用 户 控件 的 输出 缓存 
策略 
ee 该 指令 以 声明 的 方式 指示 另 一 个 用 户 控件 或 页 源 文件 应 该 被 动态 编译 并 链 
接 到 在 其 中 声明 该 指令 的 页 
Ge 该 指令 将 别名 与 命名 空间 及 类 名 关联 起 来 ,以 便 在 自 定义 控件 语法 中 使 用 简 


明 的 表示 法 
2.2.2 Request 对 象 


Request 对 象 是 ASPNET 当中 最 有 用 的 对 象 之 一 , 它 与 Response 对 象 一 起 使 用 ,达到 
沟通 客户 端 与 服务 器 端的 作用 ， 使 它们 之 间 可 以 很 简单 地 交换 数据 。 

Request 对 象 接收 客户 端 通过 表单 或 URL 地 址 串 发 送 来 的 变量 ， 同 时 ， 也 可 以 接收 其 
他 客户 端的 环境 变量 ， 如 浏览 器 的 基本 情况 、 客 户 端的 了 地 址 等 。 所 有 从 前 端 浏览 器 通过 
HTTP 通信 协议 送 往 后 端 Web 服务 器 的 数据 ， 都 是 借助 Request 对 象 完成 的 。 

Request 对 象 是 System.Web.HttpRequest 类 的 实例 ， 当 用 户 请 求 页 面 时 ，ASP.NET 将 
自动 创建 Request 对 象 。 

1. Request 对 象 的 属性 


Request 对 象 的 常用 属性 如 表 2-7 所 示 。 


表 2-7_Request 对 象 的 常用 属性 


JE 性 描述 
ApplicationPath 获取 ASP.NET 应 用 程序 虚拟 目录 的 根 目 录 
Browser 获取 和 设置 客户 端 浏览 器 的 兼容 性 信息 
ContentEncoding 获取 Request 对 象 的 编码 方式 
ContentLength 获取 客户 端 发 送信 息 的 字 节 数 
ContentType 获取 和 设置 请 求 的 MIME 类 型 
Cookies 获取 客户 端 Cookie 
FilePath 当前 请 求 的 虚拟 路 径 
Files 获取 客户 端 上 传 的 文件 集合 
Form 获取 表单 变量 集合 
Headers 获取 HTTP 头 信息 
HttpMethod HTTP 数据 传输 方法 ， 如 GET、POST 
Path 获取 当前 请 求 的 虚拟 路 径 
PhysicalPath 获取 请 求 的 URL 物理 路 径 
QueryString 获取 查询 字符 串 集合 
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( 续 表 ) 
E tE 描 g 
ServerVariables 获取 服务 器 变量 集合 
TotalBytes 获取 输入 文件 流 的 总 大 小 
Url 获取 当前 请 求 的 URL 
UrlReferrer 获取 该 请 求 的 上 一 次 请 求 的 页 面 
UserAgent 客户 端 浏览 器 信息 
UserHostAddress 客户 端 了 地址 
UserHostName 客户 端 DNS 名 称 
UserLanguages 客户 端 语言 


2. 使 用 Form 和 QueryString 集合 传递 数据 


ASP.NET 是 使 用 表单 (Form) 来 实现 用 户 数据 提交 的 。 对 于 HTML 表单 ， 可 以 使 用 Get 
方法 或 Post 方法 来 实现 数据 提交 。 如 果 使 用 Get 方法 ,就 要 使 用 Request 对 象 的 QueryString 
集合 来 得 到 相关 的 信息 ; 如 果 使 用 Post 方法 ， 就 要 使 用 Request 对 象 的 Form 集合 来 得 到 
相关 信息 。 下 面 分 别 讲解 如 何 使 用 Get 方法 和 Post 方法 。 

o Ge Dik: 使 用 Get 方法 进行 数据 提取 时 ， 用 户 要 提交 的 信息 往往 是 作为 查询 字符 

串 加 在 URL 的 后 面 传 给 接收 程序 的 ,一般 限 制 在 2KB 左右 。 例如: http://www. 
domain.com/test.aspx?name=myname&password=mypassword。 这 样 ， 在 服务 器 端 就 


可 以 使 用 QueryString 集合 对 象 来 获取 数据 : 


Request.QueryString["name"] 
Request.QueryString["password"] 

o ”Post 方法: 使 用 Post 方法 时 ， 用 户 浏览 器 的 地 址 栏 中 不 会 显示 相关 的 查询 字符 串 。 
因此 ， 如 果 需 要 提交 的 数据 很 多 时 ， 应 使 用 Post 方法 ， 因 为 它 对 数据 的 大 小 和 长 
度 没 有 什么 限制 。 另 外 ， 由 于 地 址 栏 中 不 显示 相关 的 查询 字符 串 ， 所 以 使 用 Post 
方法 就 十 分 适合 用 来 传递 保密 信息 ， 例 如 用 户 的 账号 和 密码 。 使 用 Post 方法 提交 
的 数据 ， 在 服务 器 端 可 以 使 用 Form 集合 对 象 来 获取 ， 其 语法 格式 如 下 所 示 : 
RequestForm 


Request.Form["name"] 
Request.Form.Get(Index) 


3. Request 对 象 的 方法 


Request 对 象 的 常用 方法 如 表 2-8 所 示 。 
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表 2-8 Request 对 象 的 常用 方法 


p 法 描述 
BinaryRead 以 二 进 制 方式 读 取 指 定 字 节 的 输入 流 
MapPath 为 当前 请 求 将 请 求 的 URL 中 的 虚拟 路 径 映 射 到 物理 路 径 
SaveAs 保存 HTTP 请 求 到 硬盘 
ValidateInput 验证 客户 端 输入 的 数据 ， 如 果 具 有 潜在 的 风险 ， 则 将 会 引发 一 个 异常 


2.2.3 Response 对 象 


Response 对 象 用 于 向 客户 端 浏览 器 发 生 数据 ， 告 诉 浏览 器 回应 内 容 的 报头 、 服 务 器 端 
的 状态 信息 以 及 输出 指定 的 内 容 。 用 户 可 以 使 用 该 对 象 将 浏览 器 的 数据 以 HTML 的 格式 发 
送 到 用 户 端 的 浏览 器 ， 它 与 Request 组 成 一 对 接收 、 发 送 数 据 的 对 象 ， 这 也 是 实现 动态 的 
基础 。 

Response 对 象 实际 是 System.Web 命名 空间 中 的 HttpResponse 类 的 实例 。CLR 会 根据 
用 户 的 请 求 信息 建立 一 个 Response 对 象 。 

1. Response 对 象 的 属性 

Response 的 常用 属性 如 表 2-9 所 示 。 


表 2-9 Response 对 象 的 常用 属性 


属 性 描述 
获取 或 设置 是 否 缓冲 输出 。 如 有 缓冲 ， 服 务 器 在 所 有 当前 处 理 的 页 面 的 语 
Buffer 句 被 处 理 之 前 不 将 Response 送 往 客 户 端 , 除非 有 Flush 或 End 方法 被 调用 。 
True 表示 需要 ，False 表示 不 需要 ， 默 认 值 是 True 
Cache 获取 缓 在 信息 
CharSet 获取 和 设置 输出 流 的 HTTP 字符 集 
获取 和 设置 输出 流 的 MIME 类 型 ， 默 认 值 为 :text/html， 常 用 的 类 型 还 有 : 
SOD BE text/xml, text/plain, image/gif, image/jpeg 
Cookie 获取 Cookie 集合 
Expires 获取 和 设置 浏览 器 缓存 超时 时 间 
IsClientConnected 获取 客户 端 是 否 和 服务 器 连接 
Status 设置 返回 给 客户 端的 状态 
StatusCode 获取 和 设置 返回 给 客户 端 状 态 字符 串 
StatusDescription 获取 和 设置 状态 说 明 


2. Response 对 象 的 方法 
Response 对 象 的 常用 方法 如 表 2-10 所 示 。 


5 ASPNET 4.0 网 站 开发 实例 教程 


2-10 Response 对 象 的 常用 方法 


F _ 法 H o Ë 
AddHeader 添加 HTTP 头 信息 
AppendCookie 添加 一 个 Cookie 
AppendHeader 追加 HITP 头 信息 
AppendToLog 添加 自 定义 信息 到 IIS 日 志 中 
BinaryWrite 以 二 进 制 的 方式 输出 
Clear 清除 输出 缓存 
Close 关闭 和 客户 端的 Socket 连接 
End 发 送 所 有 缓冲 到 客户 端 ， 并 且 停 止 执行 页 面 
Flush 发 送 所 有 缓存 到 客户 端 
Redirect 重新 定向 URL 
rn BATARE URL 到 所 指定 URL 的 永久 重 定 向 ， 并 提供 用 于 完成 响应 
的 选项 
SetCookie 更 新 一 个 已 有 的 Cookie 
Write 输出 信息 
WriterFile 直接 将 指定 文件 写 到 输出 流 


3. 重 定向 到 另 一 个 页 面 


以 编程 的 方式 将 用 户 重 定向 到 另 一 个 页 面 ， 在 ASP.NET 中 是 非常 有 用 和 普 过 的 。 例 

如 ， 在 一 个 第 三 方 支付 页 面 ， 一 旦 支付 成 功 了 ， 将 在 几 秒 钟 之 后 自动 跳 转 到 商家 页 面 。 

ASP.NET 支持 3 种 通过 编写 程序 将 用 户 重 定向 到 新 页 面 的 主要 方式 : 其 中 两 种 就 是 使 
] Response 对 象 的 Redirect 和 RedirectPermanent(ASP.NET 4 中 新 增 的 选项 ) 方 法 ， 而 第 3 
中 则 是 使 用 2.2.5 节 将 要 介绍 的 Server 对 象 的 Transfer 方法 ， 它 是 在 客户 端 执行 的 。 此 处 
和 E 点 介绍 前 两 种 方法 。 

在 每 个 ASPX 页 面 内 ， 用 户 都 具有 对 Response 属性 的 访问 权限 ，Response 对 象 的 
Redirect 和 RedirectPermanent 方法 会 向 浏览 器 发 送 请 求 新 页 面 的 指令 。 每 个 Redirect 方法 
能 以 两 种 不 同 的 方式 使 用 : 


A ses 


Im, 


Response.Redirect(newUrl) 
Response.Redirect(newUrl, endResponse) 
Response.RedirectPermanent(newUrl) 
Response.RedirectPermanent(newUrl, endResponse) 


Redirect 和 RedirectPermanent 的 区 别 主 要 与 搜索 引擎 优化 有 关 。 使 用 Redirect 是 告诉 
客户 端 ， 页 面具 是 被 临时 移动 了 。 通 常 使 用 该 方法 基于 某 些 动作 将 用 户 重 定向 到 一 个 新 页 
面 上 。 例 如 ， 在 填写 完 注 册 信 息 后 ， 可 能 需要 将 用 户 导航 到 一 个 注册 成 功 页 面 或 是 注册 并 
登录 成 功 后 的 页 面 。 
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RedirectPermanent 用 于 告诉 客户 端 ， 页 面 被 永久 移动 了 。 例 如 ， 网 站 中 有 一 个 不 再 使 
的 页 面 Index.aspx。 搜 索引 擎 可 能 会 一 直 请 求 这 个 页 面 。 如 果 将 下 面 的 代码 添加 到 
Index.aspx 后 台 代 码 文 件 中 , 客户 端 (包括 搜索 引擎 ) 就 会 被 导航 到 Default.aspx 页 面 。 此 时 ， 
搜索 引擎 会 记录 永久 性 重 定向 的 节点 ， 并 会 停止 对 Index.aspx 页 面 的 请 求 ， 且 定位 到 
Default.aspx 页 面 上 。 


protected void Page Load(object sender, EventArgs e) 


d 
Response.RedirectPermanent("Default.aspx"); 

i 

说 明 : 


重 定向 方法 的 另 一 个 版 本 有 一 个 名 为 endResponse 的 附加 Boolean 参数 ， 当 
endResponse 参数 为 False 时 ， 它 允许 在 重 定向 动作 完成 后 执行 余下 的 所 有 代码 。 这 并 不 是 
必需 的 ， 但 在 默认 情况 下 使 用 它 来 结束 响应 。 


4. Request 和 Response 对 象 配 合 使 用 


下 面 的 例子 演示 了 Request 和 Response 对 象 的 配合 使 用 。 

例 2-2: 利用 Request 对 象 和 Response 对 象 进行 数据 传送 ， 理 解 GET 和 POST 方法 的 
不 同 ， 以 及 数据 的 获取 方式 。 

(1) 启动 VWD 2010， 打 开 网 站 Chapter2， 通 过 “添加 新 项 ”对 话 框 在 该 网 站 中 添加 一 
个 名 为 Requestaspx 的 Web 窗 体 页 。 

(2) 在 Request.aspx 页 面 的 <body> 标 签 中 添加 如 下 代码 : 


<body> 

<h2> 登 录 页 面 </h2> 
<form id="form1" action="Response.aspx" method="post"> 
姓名 : <input name="user" type="text" /> 
<b> $i: <input name="password" type="text" /> 
<br><input name="submit" type="submit" value="POST 方式 提交 " > 
</form> 
<form id="form2" action="Response.aspx" method="get"> 
<br> 姓 名 : <input name="user" type="text" /> 
<br> 密 码 : <input name="password" type="text" /> 
<br><input name="submit" type="submit" value="GET 方式 提交 " /> 
</form> 

</body> 


在 Request.aspx 页 面 中 ， 定 义 两 个 表单 : forml 和 form2， 分 别 使 用 POST 和 GET Ù 
式 提 交 数 据 到 Response.aspx 页 面 ， 下 面 我 们 就 来 创建 Response.aspx 页 面 。 

G) 在 “解决 方案 资源 管理 器 ”窗口 中 , 右 击 解决 方案 ， 从 弹出 的 快捷 菜单 中 选择 “ 添 
加 新 项 ”命令 ， 添 加 名 为 Response.aspx 的 Web 窗 体 。 
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(4) 在 Response.aspx 页 面 中 的 <body> 标 签 中 添加 如 下 代码 : 


<body> 
<form id="form1" runat="server"> 
<div> 
<asp:button runat="server" text=" 返 回 登录 页 面 " onclick="Button1 Click" /> 
</div> 
</form> 


</body> 


(5) 在 Response.aspx.cs 代码 文件 中 ， 添 加 页 面 的 Load 事件 和 按钮 的 单 击 事件 处 理 程 
序 ， 代 码 如 下 : 


protected void Page Load(object sender, EventArgs e) 


{ 
if (Request.HttpMethod.Equals("GET")) 
{ 
Response.Write(" 以 下 信息 来 自 于 Request 页 面 ,数据 传输 方法 为 GET<br>"); 
Response.Write("QueryString: "+ Request.QueryString); 
Response.Write("<br> 用 户 名 :" + Request.QueryString["user"]); 
Response.Write("<br> 密 码 :" + Request.QueryString["password"]); 
} 
if (Request.HttpMethod.Equals("POST")) 
{ 
Response.Write(" 以 下 信息 来 自 于 Request 页 面 ,数据 传输 方法 为 POST"); 
Response.Write("<br> 用 户 名 :" + RequestForm["user"]): 
Response.Write("<br> 密 码 :" + Request.Form["password"]); 
) 
} 
protected void Button1_Click(object sender, EventArgs e) 
{ 
Response.Redirect("Request.aspx"); 
) 


现在 ， 站 点 中 一 共有 3 个 Web 页 面 了 ,那么 ， 如 何 确 定 站 点 的 起 始 页 呢 ? 下 面 介绍 如 
何 设 置 站 点 的 启动 选项 。 

(6) 选择 “视图 ”|“ 属 性 页 ”命令 ， 或 者 在 “解决 方案 资源 管理 器 ”窗口 中 右 击 解 决 
方案 ， 从 弹出 的 快捷 菜单 中 选择 “属性 页 ”命令 ， 打 开 网 站 的 “属性 页 ”对 话 框 ， 选 择 “ 启 
动 选项 ”， 如 图 2-6 所 示 ， 默 认 的 启动 选项 为 当前 页 。 
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图 2-6 网 站 的 “属性 页 ”对 话 框 


(7) 在 本 例 中 ， 设 置 启 动 页 为 Request.aspx， 在 右 侧 区 域 中 选中 “特定 页 ” 单 选 按 钮 ， 
此 时 ， 后 面 的 文本 框 和 浏览 按钮 会 被 激活 ， 可 直接 在 文本 框 中 输入 Request.aspx; 也 可 以 
单 击 按钮 ， 从 弹出 的 对 话 框 中 选择 Request.aspx 页 面 ， 如 图 2-7 所 示 。 


图 2-7 设置 启动 页 为 Request.aspx 页 面 


(8) 编译 并 运行 程序 ， 在 浏览 器 中 加 载 Request.aspx 页 ， 如 图 2-8 所 示 。 
(9) 在 上 方 的 两 个 文本 框 中 分 别 输入 “姓名 ”和 “密码 ”, 然后 单 击 “POST 方式 提交 ” 
按钮 ， 跳 转 到 Response.aspx 页 面 ， 如 图 2-9 所 示 。 


Er SO- ER > == 加 
ANER fE http://localhost :8125/Chapter2/Request aspx | | XD MO FEV KREW IAD WHW 
RERR Eroen.. | | Ñ + D | 
登录 页 面 — uaii —I 
K— 以 下 信息 来 自 于 Requesi 页 面 数 据 传输 方法 为 POST 
POST 方式 提交 HAN 
=. — 密码 赵 艳 铎 
姓名 : 
密码 : CEES] 
EET = 
ər n Su @ mu FORE 


图 2-8 Request.aspx 页 面 图 2-9 以 POST 方式 传送 数据 
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(10) 单 击 “ 返 回 登 录 页 面 ”按钮 ， 返 回 到 Request.aspx 页 面 ， 在 下 面 的 文本 框 中 输入 
“姓名 ”和 “密码 ”， 单 击 “ 以 GET 方式 提交 ”按钮 ， 此 时 得 到 的 页 面 如 图 2-10 所 示 ， 
可 以 在 “标题 栏 ” 和 “地 址 栏 ”中 看 到 传递 的 参数 。 
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图 2-10 以 GET 方式 传送 数据 


2.2.4 Application 对 象 


Application 对 象 用 来 保存 希望 在 多 个 页 面 之 间 传 递 的 变量 。 由 于 在 整个 应 用 程序 生存 
周期 中 ，Application 对 象 都 是 有 效 的 ， 所 以 在 不 同 的 页 面 中 都 可 以 对 它 进行 存 取 ， 就 像 使 
用 全 局 变量 一 样 方便 。 

在 ASP.NET 环境 中 ，Application 对 象 是 System.Web.HttpApplicationState 类 的 实例 ， 
它 可 以 在 多 个 请 求 、 链 接 之 间 共 享 公用 信息 ， 也 可 以 在 各 个 请 求 链接 之 间 充 当 信 息 传递 的 
管道 。 

Application 对 象 可 以 建立 Application 变量 ， 它 和 一 般 程序 变量 不 同 ，Application 变量 
是 一 个 Contents 集合 对 象 ， 此 变量 可 以 为 访问 网 站 的 每 位 用 户 提供 一 个 共享 数据 的 通道 ， 
因为 Application 变量 允许 网 站 的 每 位 用 户 获 取 或 更 改 其 值 。 

说 明 : 

Application 对 象 在 第 1 个 Session 对 象 (将 在 2.2.6 节 介 绍 ) 建 立 后 创建 ， 直 到 Web 服务 
器 关机 后 所 有 的 用 户 都 离线 后 才 会 删除 。 


1. Application 对 象 的 属性 
Application 对 象 的 常用 属性 如 表 2-11 所 示 。 


表 2-11 Application 对 象 的 常用 属性 


E 性 描 — Ë 
AllKeys 获得 访问 HttpApplicationState 集合 的 所 有 键 
Contents 获得 HttpApplicationState 对 象 的 引用 
Count 获得 HttpApplicationState 集合 的 数量 
Item 通过 名 称 和 索引 访问 HttpApplicationState 集合 
Keys 获得 访问 HttpApplicationState 集合 的 所 有 键 , 从 NameObjectCollectionBase 继承 
StaticObjects | ”获得 所 有 使 用 <object> 标 签 声明 的 应 用 程序 集 对 象 
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2. Application 对 象 的 方法 


Application 对 象 的 常用 方法 如 表 2-12 所 示 。 
表 2-12 Application 对 象 的 常用 方法 

方 ” 法 Ho B 
Add 添加 一 个 新 的 对 象 到 HttpApplicationState 集合 
Clear 清除 HttpApplicationState 集合 中 的 所 有 对 象 
Get 通过 索引 和 名 字 获 得 HttpApplicationState 对 象 
GetKey 通过 索引 获得 一 个 HttpApplicationState 名 称 
Lock 锁定 访问 HttpApplicationState 变量 
Saip 取消 锁定 ， 一 般 情 况 下 需要 操作 Application 变量 则 设置 为 Lock， 操 作 完成 

后 则 设置 为 Unlock 

Remove 从 HttpApplicationState 集合 删除 一 个 对 象 
RemoveAll 删除 HttpApplicationState 集合 所 有 对 和 象 
RemoveAt 根据 索引 删除 一 个 HttpApplicationState 对 象 
Set 更 新 一 个 HttpApplicationState 变量 


3. 使 用 Application 对 象 


不 论 网 站 中 有 多 少 位 用 户 同时 浏览 网 站 ， 在 服务 器 端 都 只 保留 一 份 Application 变量 。 
可 以 使 用 如 下 语法 格式 来 设置 或 读 取 Application 变量 : 


Application["title"]=" 金 百合 拉丁 舞 培训 学 校 " 
Application.Set("count",(int)Application["count"] + 1); 


ASP.NET 应 用 程序 的 每 位 用 户 都 可 以 存 取 Application 变量 ， 用 户 可 以 同时 读 取 
Application 变量 , 但 是 在 同一 时 间 只 能 允许 一 位 用 户 修改 Application 变量 ， 这 就 需要 使 用 
Lock 和 Unlock 方法 。 在 修改 Application 变量 之 前 先 使 用 Lock 方法 进行 锁定 ， 修 改 完 以 
后 再 使 用 Unlock 方法 解锁 。 

例 2-3 将 演示 Application 对 象 的 使 用 。 

例 2-3: 使 用 Application 对 象 统计 网 站 访问 人 数 。 

(1) 启动 VWD 2010， 选 择 “ 文 件 ”|“ 打 开 网 站 ”命令 ， 打 开 网 站 Chapter2 。 

(2) 在 网 站 中 添加 一 个 名 为 Application.aspx 的 Web 窗 体 ,在 “设计 ”视图 中 添加 一 个 
Label 控件 到 Web 窗 体 中 ， 系 统 自动 将 它 命名 为 Labell。 

(3) 在 Application.aspx.cs 文件 中 添加 页 面 的 Load 事件 处 理 程 序 ， 代 码 如 下 : 


protected void Page Load(object sender, EventArgs e) 
{ 
Application.LockO; 
Application["count"] = (Convert.Tolnt32(Application["count"]) + 1).ToString0; 
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Application.UnLock(); 


Labell.Text = "您 是 第 "+ Application["count"].ToString0 +" 位 访客 "; 
} 


(4) 编译 并 运行 程序 ， 在 浏览 器 中 打开 Application.aspx WH, WE 2-11 所 示 , 刷新 页 
面 可 以 发 现 数 字 会 增加 。 


Æ http://localhost:8125/Chapter2/Application. aspx — W...|- OJEJ 


go- e localhost mji x 
XFO SEO SEV KERO IAW 帮助 0) 

ABER Æ http://locslhost:81. A-D- Oa- mov” 
您 是 第 5 位 访客 

== @ r PPK 


图 2-11 Application 对 象 示例 


注意 : 

在 例 2-2 中 ,设置 了 网 站 的 启动 选项 为 Request.aspx 页 面 ， 因 此 本 例 中 局 动 网 站 默认 
打开 的 是 Request.aspx 页 面 ,读者 需要 手动 在 地 址 栏 中 输入 Application.aspx 页 面 或 修改 网 
站 的 启动 选项 才能 访问 Application.aspx 页 面 。 


22.5 Server 对 象 


Server 对 象 即 服务 器 对 象 ， 就 是 在 服务 器 上 工作 的 一 个 对 象 ， 它 包含 一 些 与 服务 器 相 
关 的 信息 ， 是 System.Web.HttpServerUtility 类 的 实例 。 使 用 它 可 以 获取 最 新 的 有 关 出 错 的 
信息 ， 在 页 面 之 间 传 递 控件 ， 对 HTML 进行 编码 和 解码 等 。 


1. Server 对 象 的 属性 
Server 对 象 的 属性 可 以 获取 Web 服务 器 名 称 和 设置 或 获取 超时 时 间 ， 如 表 2-13 所 示 。 


表 2-13 Server 对 象 的 常用 属性 


E 性 描述 
MachineName 获得 服务 器 计算 机 名 称 
ScriptTimeonut 获得 和 设置 请 求 超时 的 事件 


2. Server 对 象 的 方法 


Server 对 象 的 方法 可 以 获取 文件 路 径 、 使 用 COM 组 件 以 及 执行 HTML 和 URL 编码 。 
其 常用 方法 如 表 2-14 所 示 。 
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R 2-14 Server 对 象 的 常用 方法 


5 3 描述 
ClearError 清除 前 一 个 异常 
CreateObject 建立 一 个 COM 组 件 对 象 的 实例 
Execute 执行 指定 资源 并 返回 
GetLastError 获取 最 近 一 次 异常 
Transfer 结束 当前 页 执行 ， 转 到 其 他 页 执行 
HtmlEncode 将 指定 的 字符 串 进行 HTML 编码 
HtmlDecode 进行 HTML 解码 
MapPath 对 虚拟 目录 进行 物理 映射 
oe 进行 URL 编码 ， 以 便 通过 URL 从 Web 服务 器 到 客户 端 进行 可 靠 的 HTTP 
传输 
UrlDecode 进行 URL 解码 
UrlPathEncode 对 URL 字符 串 的 路 径 部 分 进行 URL 编码 ， 并 返回 已 编码 的 字符 串 


3. 服务 器 端 重 定向 
如 果 要 对 用 户 的 请 求 发 出 不 同 的 页 面 ， 而 又 不 想 修改 客户 端的 地 址 栏 ， 那 么 ， 使 用 服 
务 器 端 重 定向 就 非常 方便 。 这 样 可 以 隐藏 页 面 名 称 和 查询 字符 串 的 细节 ， 从 而 产生 从 用 户 
的 角度 来 看 比较 干净 的 URL。 这 通常 用 在 所 谓 的 URL 重 写 的 情况 中 ,用 于 创建 干净 的 URL。 
例如 ， 用 户 可 能 请 求 一 个 这 样 的 页 面 : 
http://www.yanzhao.com/Pictures/2012/03/ 
服务 器 在 后 台 可 能 将 其 转换 为 : 
http://www. yanzhao.com/Pictures/Display.aspx?year=2012&month=03 


显然 , 第 一 个 URL 更 容易 理解 和 在 浏览 器 中 输入 。 除 了 容易 理解 外 ， 服 务 器 端 重 定 向 
也 可 能 稍稍 加 快 站 点 的 速度 。 不 用 向 浏览 器 发 送 响应 让 它 去 请 求 一 个 新 页 面 ， 而 是 直接 将 
用 户 转 到 新 页 面 上 ， 以 节省 一 些 网 络 开销 。 
服务 器 端 重 定向 使 用 的 就 是 Server 对 象 的 Transfer 方法 。Server.Transfer 不 是 指示 浏 
览 器 去 获取 一 个 新 页 面 ， 而 是 完全 在 服务 器 上 发 生 。 放 弃 旧 页 面 的 输出 ， 并 启动 新 的 页 
生命 周期 。 然 后 将 新 的 页 面 生成 的 内 容 发 送 回 浏览 器 ， 而 保持 浏览 器 的 地 址 栏 不 变 。 下 下 
举例 说 明 Response.Redirect 和 Server.Transfer 方法 之 间 的 区 别 。 

例 2-4: 使 用 服务 器 端 重 定向 将 用 户 导 航 到 Response.aspx 页 面 。 

(1) 启动 VWD 2010， 选 择 “ 文 件 ”|“ 打 开 网 站 ”命令 ， 打 开 网 站 Chapter2。 

(2) 在 网 站 中 添加 一 个 名 为 Transfer2Response.aspx 的 Web 窗 体 。 

(3) 无 须 设 计 页 面 ， 直 接 打 开 Transfer2Response.aspx 页 面 的 后 台 代 码 文件 ， 在 页 面 的 
Load 事件 中 添加 如 下 代码 : 


过 | 


过 | 
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protected void Page Load(object sender, EventArgs e) 
{ 

Server. Transfer("Response.aspx?user E 4 &password=# f9"); 
} 


(4) 编译 并 运行 程序 , 在 浏览 器 中 打开 Transfer2Response.aspx 页 面 , 效果 如 图 2-12 所 示 。 


http://localhost:8125/Chapter2/Transfer2Response... 


EI [E] http://localhost:8125/Chapter2/Transfer2Response. aspx |M] 好 | | X 


XED RED SEV KRW IAV 帮助 
ARER Æ http://localhost:81.. A-A- 2#- = 


B 


以 下 信息 来 自 于 Request 页 面 ,数据 传输 方法 为 GET 
QuerySting，user=96u533Pbn540d&password=96n5bc696u7801 
姓名 :匿名 

密码 密码 


完成 @ Internet fa- 10 ~ 
图 2-12 服务 器 端 重 定向 


从 图 2-12 中 可 以 看 出 ， 页 面 已 经 被 重 定向 到 “Response.aspx?user= 匿 名 &password= 密 
人 码 ”， 然 而 ， 浏 览 器 的 地 址 栏 并 没有 改变 ， 仍 然 显 示 为 Transfer2Response.aspx， 对 用 户 隐 
藏 了 新 页 面 名 称 和 查询 字符 串 值 。 

提示 : 

Server.Transfer 只 能 用 来 重 定向 到 站 点 内 的 其 他 页 面 ,而 不 能 将 用 户 导 航 到 不 同 域 上 的 
页 面 。 


4. 使 用 Server 对 象 


Server 对 象 的 另 一 个 重要 功能 是 对 字符 进行 URL 和 HTML 的 编码 和 解码 。URL 编码 
的 目的 是 保证 所 有 浏览 器 能 够 正确 地 传输 URL 路 径 ， 一 些 特殊 字符 如 ? 、&&、/、 空 格 和 
中 文字 符 等， 在 传输 时 都 有 可 能 让 浏览 器 发 生 错 误 。 因 此 ， 可 以 先 通过 编码 再 将 其 传输 ， 
在 需要 使 用 时 又 通过 解码 将 其 还 原 .HTML 编码 的 作用 是 将 所 有 字符 全 部 转换 为 HTML 中 
能 够 用 来 显示 的 字符 ， 例 如 ，<p> 如 果 直 接 显示 就 是 一 个 段落 ， 而 转换 以 后 就 会 变 成 
&lt;p&gt; 浏览 时 就 可 以 正确 显示 出 <p>， 从 而 不 会 造成 错误 。 

例 2-5: 使 用 Server 对 象 获取 服务 器 信息 。 

(1) 启动 VWD 2010， 选 择 “ 文 件 ”|“ 打 开 网 站 ”命令 ， 打 开 网 站 Chapter2 。 

(2) 在 网 站 中 添加 一 个 名 为 Server.aspx 的 Web 窗 体 。 

G) 在 Default.aspx.cs 文件 中 添加 页 面 的 Load 事件 处 理 程序 ， 代 码 如 下 : 


protected void Page Load(object sender, EventArgs e) 

{ 
Response.Write(" 使 用 Server 对 象 获取 服务 器 信息 ， 如 下 所 示 : "; 
Response.Write("<br> 服 务 器 名 称 : "+ Server.MachineName); 
Response.Write("<br> 服 务 器 超时 时 间 : "+ Server.ScriptTimeout); 
Response.Write("<br> 下 面 将 显示 一 条 水 平 线 <hr>"); 


第 2 章 ASPNET 基础 知识 “43。 


Response.Wriite("<br> 下 面 将 显示 字符 "+ Server.HtmlEncode(" <hr>")); 
} 


(4) 编译 并 运行 程序 ， 在 浏览 器 中 查看 Server.aspx， 效 果 如 图 2-13 所 示 。 
| 


ge -E Localhost 5125; | x 
| XFO RED SEV wQ) IAD HHW 
RRR — Q http://Localhost:8125/Chapter. . a-a 


使 用 Server 对 象 获取 服务 器 信息 ， 如 下 所 示 : | 
服务 器 名 称 ，ZHAO 

服务 器 超时 时 间 ，110 
下 面 将 显示 一 条 水 平 线 


下 面 将 显示 字符 <hr> 


@ Internet far Rir ~ 


图 2-13 Server 对 象 示例 


提示 : 
在 Response.aspx 页 面 中 , 输出 的 QueryString 集合 就 是 经 过 URL 编码 后 的 格式 , 读者 
可 以 自己 将 其 用 ServerUrlDecode 方法 进行 解码 ， 查 看 解码 后 的 输出 效果 。 


226 Session 对 象 


Session 对 象 是 System.Web.HttpSessionState 类 的 实例 ， 其 作用 是 储存 特定 的 信息 ， 但 
是 它 和 Application 对 象 储存 信息 所 使 用 的 对 象 是 完全 不 同 的 。Application 对 象 储存 的 是 共 
享 信息 ， 而 Session 储存 的 信息 是 局 部 的 ， 是 随 用 户 不 同 而 不 同 的 。 如 果 只 需 在 不 同 页 中 
共享 数据 ， 而 不 是 在 不 同 的 客户 端 之 间 共 享 数据 就 可 以 使 用 Session 对 象 。 

Session 的 生命 周期 是 有 限 的 (默认 值 为 20 分 钟 )， 可 以 使 用 Timeout 属性 进行 设置 。 在 
Session 的 生命 周期 内 ，Session 的 值 是 有 效 的 。 如 果 用 户 在 大 于 生命 周期 的 时 间 里 没有 再 
访问 应 用 程序 ，Session 就 会 自动 过 期 ， 即 Session 对 象 将 会 被 CLR 释放 ， 其 中 保存 的 数据 
信息 也 将 丢失 。 

1. Session 对 象 的 属性 


Session 对 象 提 供 了 对 会 话 状 态 值 以 及 会 话 级 别 设置 和 生存 管理 方法 的 访问 , 其 常用 的 
属性 如 表 2-15 所 示 。 


表 2-15 Session 对 象 的 常用 属性 
B 性 描述 
获取 或 设置 字符 集 标识 


Contents 获取 当前 Session 状态 对 象 的 引用 
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( 续 表 ) 
E -性 描 ” 述 
获取 当前 的 Cookie 模式 ， 以 确定 系统 是 否 要 将 Session 配置 为 不 需要 Cookie 
CookieMode 
支持 
Count Session 状态 集合 的 总 数 
是 否 需 要 Cookie XF, 如 果 需 要 就 可 以 将 Session ID 保存 在 Cookie 中 ,如果 
IsCookieless i E 
不 需要 就 必须 嵌入 在 URL 中 
IsNewSession 标志 当前 Session 是 否 是 新 的 Session 
IsReadOnl 是 否 只 读 
IsSynchronized 是 否 同步 
Item 通过 索引 获取 或 者 设置 单个 Session 值 
Keys 获取 Session 集合 的 所 有 键 
LCID 获取 和 设置 当前 Session 的 本 地 标识 符 
Mode 获取 当前 的 Session 模式 
获取 Session 的 唯一 编号 , 为 了 区 别 不 同 的 会 话 ， 系 统 会 为 每 一 个 会 话 分 配 一 
SessionID 
个 唯一 的 了 D 
获取 在 Global.asax 中 以 <object Runat="Server" Scope="Session" /> 声明 的 对 象 
StaticObjects 
集合 
. 获取 和 设置 会 话 超时 时 间 ， 如 果 客 户 端 在 连续 一 个 时 间 段 内 没有 反应 ， 就 自 
Timeonut 


动 清除 会 话 ， 断 开 连 接 ，Timeout 就 是 这 个 时 间 段 


2. Session 对 象 的 方法 
Session 对 象 的 常用 方法 如 表 2-16 所 示 。 


表 2-16 Session 对 象 的 常用 方法 


3. Session 变量 


每 一 个 Session 对 


方 ” 法 描述 
Add 添加 一 个 新 对 象 到 HttpSessionState 集合 
Clear 清除 HttpSessionState 集合 中 的 所 有 对 象 
Get 通过 索引 和 名 字 获 得 HttpSessionState 对 象 
Abandon 清除 当前 会 话 
CopyTo 复制 Session 状态 集合 到 一 个 一 维 数组 
Remove 从 HttpSessionState 集合 删除 一 个 对 和 象 
RemoveAll 删除 HttpSessionState 集合 所 有 对 和 象 
RemoveAt 根据 索引 删除 一 个 HttpSessionState 对 象 


| 象 都 具有 唯一 的 SessionID 编号 ， 在 浏览 ASP.NET 应 用 程序 的 整个 


过 程 中 ， 都 可 以 存 取 Session 对 象 建立 的 变量 。 


第 2 章 ASPNET 基础 知识 AFE 


技巧 : 

£ ASP.NET Web 应 用 程序 中 可 以 使 用 SessionID 编号 判断 用 户 是 否 仍 在 Session 时 间 ， 
它 是 直到 Session 对 象 的 TimeOut 属性 设 定时 间 到 时 或 执行 了 Abandon 方法 后 才 会 结束 
Session 时 间 。 


如 果 同 时 有 多 位 用 户 浏览 网 站 ， 那 么 每 位 用 户 都 被 指定 不 同 的 SessionID 编号 ， 只 允 
许 拥 有 此 ID 的 用 户 存储 此 ID 的 Session 变量 。 
Session 变量 是 用 户 的 专用 数据 ， 虽 然 每 位 用 户 的 Session 变量 名 是 相同 的 ， 但 是 ， 变 
量 的 值 确 可 能 不 同 。 而 且 每 个 用 户 只 能 存 取 自 己 的 Session 变量 。 例 如 ， 用 户 liuxf 访问 网 
站 ， 程 序 为 其 建立 的 Session 变量 如 下 : 
Session["usermmame"]=" 刘 秀芬 "; 
Session["city"]=" 沧 州 "; 
接着 ， 男 一 位 用 户 zhaoyd 也 请 求 访问 网 站 ， 系 统 也 会 为 他 建立 一 组 Session 变量 ， 但 
值 确 不 同 ， 例 如 : 
Session["usemame"]=" 赵 艳 铎 "; 
Session["city"]=" 北 京 "; 
4. 使 用 Session 对 象 


对 于 Web 应 用 程序 的 用 户 数据 ， 或 是 购物 车 等 个 人 专属 数据 ， 通 常 都 使 用 Session 对 
象 进行 存储 和 管理 。 
例 2-6: 使 用 Server 对 象 存 储 用 户 数据 。 
(1) 启动 VWD 2010， 选 择 “ 文 件 ”|“ 打 开 网 站 ”命令 ， 打 开 网 站 Chapter2 。 
(2) 在 网 站 中 添加 一 个 名 为 Sessionl.aspx 的 Web 窗 体 。 
(3) 打开 Session1.aspx 的 设计 视图 , 添加 一 个 TextBox 控件 和 一 个 Button 控件 到 Web 
窗 体 中 ， 系 统 自动 为 它们 命名 为 TextBoxl 和 Button1。 
(4) 在 后 台 代码 文件 中 添加 页 面 的 Load 事件 处 理 程序 ， 代 码 如 下 : 
protected void Page Load(object sender, EventArgs e) 
$ 
Response.Write(" 下 面 是 获取 到 的 Session 信息 : "); 
Response. Write("<br>SessionID: "+ Session.SessionID); 
Response. Write("<br>Session 的 数量 : " + Session.Count); 
Response. Write("<br>Session 的 模式 : " + Session.Mode); 
Response.Write("<br>Session 的 有 效 期 " + Session.Timeout); 
} 


(5) 为 按钮 控件 添加 单 击 事件 处 理 程 序 ， 代 码 如 下 : 


protected void Button1_Click(object sender, EventArgs e) 
ii 


Session["username"] = TextBox1.Text; 
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Response.Redirect("Session2.aspx"); 
} 


(6) 添加 一 个 名 为 Session2.aspx 的 Web 窗 体 ， 在 Session2.aspx.cs 的 Load 事件 处 理 程 
序 中 添加 如 下 代码 : 


protected void Page Load(object sender, EventArgs e) 
{ 


if (Session["username"] != null) 


ú 

Response.Write(" 通 过 Session 对 象 获取 到 的 信息 : "+ Session["username"]); 
Session.Remove("username"); 

) 

else 

$ 
Response.Redirect("Sessionl.aspx"): 

H 


y; 


(7) 编译 并 运行 程序 ， 在 浏览 器 中 请 求 Sessionl.aspx 页 面 ， 如 图 2-14 所 示 ， 在 文本 框 
中 输入 信息 ， 然 后 单 击 Button 按钮 ， 效 果 如 图 2-15 所 示 。 


ttp: //localhost:8125/Chapter2/Session... a ag) tp://localhost:81 er2/Ses... 
GO-E Localhost Ma? gə- e localhost w] 
XD MAO FFV BRAW IAD MHW XPD REO FEV KRW IAW MMW 
ARR Q http: //Localhost:8125/Chapter2/Ses. a” ARRA |Æ mi://ohost:81 t-e- 
下 面 是 获取 到 的 session 信息 f E 
SessionlD, wve45j3 Siwsi 通过 Session 对 象 获 取 到 的 信息 ， 葛 荫 戎 
Session 的 数量 ，0 
Session 的 模式 ，InProc 
Session 的 有 效 期 20 
Button = 
@ Internet a- “100 @ Internet far Rios ~ 


图 2-14 Session 对 象 示例 图 2-15 通过 Session 对 象 获取 信息 


2.2.7 Cookie 对 象 


Cookie 是 比较 常用 的 一 种 对 象 ， 通 常用 来 存储 少量 浏览 者 的 信息 ， 如 浏览 者 的 喜好 、 
户 名 和 Email 地 址 等 信息 ， 以 便于 当 浏 览 者 再 次 登录 网 站 时 ， 不 必 再 次 填写 这 些 信息 。 
1. Cookie 对 象 简介 


Se 


Cookie 俗称 “小 甜 饼 ”， 它 其 实 只 是 一 些小 文本 ， 将 一 些 用 户 信息 储存 在 客户 端的 机 
器 中 ， 它 全 部 存储 于 Windows 目录 下 的 Cookie 文件 夹 中 ， 以 便于 在 每 次 请 求 时 被 服务 器 
在 设 定 的 时 期 内 进行 读 取 。Cookie 的 储存 大 小 是 有 限制 的 ， 一 般 浏 览 器 会 将 其 大 小 控制 在 
4096 个 字 节 以 内 。 
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注意 : 

Cookie 与 网 站 关联 ， 而 不 是 与 特定 的 页 面 关联 。 因 此 ， 无 论 用 户 请 求 站 点 中 的 哪 一 个 
页 面 , 浏览 器 和 服务 器 都 将 交换 Cookie 信息 。 用户 访 问 不 同 站 点 时 ,各 个 站 点 都 可 能 会 向 
用 户 的 浏览 器 发 送 一 个 Cookie， 浏 览 器 会 分 别 存储 所 有 Cookie. 


当 用 户 请 求 站 点 中 的 页 面 时 ， 应 用 程序 发 送 给 该 用 户 的 不 仅仅 是 一 个 页 面 ， 还 有 一 个 
包含 日 期 和 时 间 的 Cookie, 用户 的 浏览 器 在 获得 页 面 的 同时 也 获得 了 该 Cookie， 并 将 它 存 
储 在 用 户 硬盘 上 的 文件 夹 中 。 以 后 , 如 果 该 用 户 再 次 请 求 站 点 中 的 页 面 , 当 该 用 户 输入 URL 
时 ， 浏 览 器 便 会 在 本 地 硬盘 上 查找 与 该 URL 关联 的 Cookie。 例 如 ， 当 用 户 登 录 163 的 邮 
箱 后 ， 如 果 在 Cookie 中 记录 了 用 户 名 信息 ， 那 么 在 Cookie 信息 失效 以 前 ， 该 用 户 在 同一 
台 计 算 机 再 次 登录 时 就 无 须 提供 用 户 名 。 

使 用 Cookie 具有 如 下 优点 。 

e 可 配置 到 期 规则 Cookie 可 以 在 浏览 器 会 话 结束 时 到 期 ， 或 者 可 以 在 客户 端 计算 

机 上 无 限期 存在 ， 这 取决 于 客户 端的 到 期 规则 。 

e 不 需要 任何 服务 器 资源 : Cookie 存储 在 客户 端 并 在 发 送 后 由 服务 器 读 取 。 

o 简单 性 ，Cookie 是 一 种 基于 文本 的 轻 量 结构 ， 包 含 简单 的 键 / 值 对 。 

° 数据 持久 性 : 虽然 客户 端 计算 机 上 Cookie 的 持续 时 间 取 决 于 客户 端 上 的 Cookie 过 

期 处 理 和 用 户 干预 ， 但 Cookie 通常 是 客户 端 上 持续 时 间 最 长 的 数据 保留 形式 。 

2. Cookie 的 修改 与 删除 

浏览 器 向 服务 器 发 出 请 求 时 ， 会 随 请 求 一 起 发 送 该 服务 器 的 Cookie。 在 ASP.NET 应 
用 程序 中 ， 是 使 用 Request 和 Response 对 象 的 Cookies 集合 对 象 来 读 取 和 设置 Cookie 的 。 

主要 的 操作 有 3 种 ， 即 设置 Cookie、 删 除 Cookie 和 获取 Cookie 的 内 容 。 

服务 器 是 不 能 直接 修改 Cookie 的 ， 修 改 Cookie 的 方法 是 重新 创建 一 个 同名 的 、 具 有 
新 值 的 新 Cookie。 例 如 : 


HttpCookie cookie=new HttpCookie("name") 
Cookie. Value=" $ ijj tjj" 


上 述 代 码 创建 了 一 个 名 为 name 的 HttpCookie 实例 。 然 后 通过 设置 Cookie 的 Value Jš 
性 为 其 设置 一 个 值 ， 从 而 将 源 Cookie 中 的 name 修改 为 “ 葛 萌 萌 ”。 
在 一 个 Cookie 中 可 以 存储 一 个 值 , 也 可 以 储存 多 个 值 . 通 过 Value 属性 , 可 以 在 Cookie 
中 存储 一 个 值 ， 如 上 面 的 代码 ， 通 过 Cookie 的 Values 集合 ， 可 以 在 同一 个 Cookie 中 储存 
多 个 值 。 例 如 : 
HttpCookie cookie=new HttpCookie("student"); 
Cookie.Values.Add(" Admin", "赵飞燕 "); 


Cookie.Values.Add("Member1", " 金 百合 "): 
Cookie. Values.Add("Member2", "小 石头 "): 


Values 集合 的 Add 方法 中 第 一 个 参数 为 关键 字 (Key)， 第 二 个 参数 是 设置 的 值 (Value)。 
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由 于 Cookie 在 用 户 计算 机 中 ， 因 此 无 法 通过 编程 将 其 直接 移 除 。 但 是 ,可 以 让 浏览 器 
来 删除 Cookie， 具 体 做 法 是 创建 一 个 与 要 删除 的 Cookie 同名 的 新 Cookie， 并 将 该 Cookie 
的 到 期 日 期 设置 为 过 去 的 某 个 日 期 当 浏 览 器 检查 Cookie 的 到 期 日 期 时 , 便 会 丢弃 这 个 已 
过 期 的 Cookie。 

3. 确定 浏览 器 是 否 接受 Cookie 

除了 限制 Cookie 的 大 小 ， 浏 览 器 还 限制 站 点 可 以 在 用 户 计算 机 上 存储 的 Cookie 的 数 
量 。 大 多 数 浏览 器 只 允许 每 个 站 点 存储 20 个 Cookie， 如 果 试 图 存储 更 多 的 Cookie， 则 存 
放 最 早 的 Cookie rae 有 些 浏 览 器 还 会 对 它们 将 接受 的 来 自 所 有 站 点 的 Cookie 
总 数 做 出 绝对 限制 ， 通 常 为 300 个 。 

另外 ， 用 户 还 可 以 将 自己 的 浏 e n akipka Cookie。 设 置 为 拒绝 接受 Cookie 
后 ， 虽 然 不 能 向 客户 端 写 入 Cookie 信息 ， 但 是 不 会 引发 任何 错误 。 同 样 ， 浏 览 器 也 不 向 服 
务 器 发 送 有 关 其 当前 Cookie 设置 的 任何 信息 。 确定 客户 端 浏 览 器 是 否 接受 Cookie 的 一 种 
方法 是 尝试 编写 一 个 Cookie, 然后 再 读 取 该 Cookie。 如 果 无 法 读 取 已 编写 的 Cookie， 则 可 
以 假定 浏览 器 不 接受 Cookie. 

4. 使 用 Cookie 对 象 


例 2-7 将 演示 Cookie 的 使 用 方法 。 

例 2-7: 演示 Cookie 的 设置 与 读 取 。 

(1) 启动 VWD 2010， 选 择 “ 文 件 ”|“ 打 开 网 站 ”命令 ， 打 开 网 站 Chapter2 。 

(2) 在 网 站 中 添加 一 个 名 为 Cookie.aspx 的 Web 窗 体 。 

(3) 打开 Cookie.aspx 的 设计 视图 ， 添 加 一 个 Label 控件 、 一 个 TextBox 控件 和 一 个 
Button 控件 到 Web 窗 体 中 ， 修 改 Button 控件 的 Text 属性 为 “提交 ”， 同 时 在 控件 的 旁边 
输入 一 些 提 示 性 的 文本 信息 ， 页 面 的 设计 效果 如 图 2-16 所 示 。 

(4) 在 后 台 代 码 文件 中 添加 页 面 的 Load 事件 和 按钮 的 单 击 事件 处 理 程序 ， 代 码 如 下 : 


protected void Page Load(object sender, EventArgs e) 


í 
HttpCookie cookie = Request.Cookies["name"]; 
if (cookie == null) 
Labell.Text = "无 Cookie 信息 ": 
else 
Labell.Text = cookie.Value ; 
) 
protected void Button1_Click(object sender, EventArgs e) 
$ 
if (TextBox1.Text == "") 
{ 
Labell.Text = "请 在 下 面 的 文本 框 中 输入 新 的 Cookie 值 "; 
Teturn; 
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HttpCookie cookie = Request.Cookies["user"]; 
1f (cookie == null) 
cookie = new HttpCookie("name"); 
cookie.Value = TextBox1.Text; 
cookie.Expires = DateTime.Now.AddDays(7); 
Response.Cookies.Add(cookie); 
} 


(5) 编译 并 运行 程序 ， 在 浏览 器 中 打开 Cookie.aspx 页 面 ， 初 次 访问 该 页 面 时 ， 由 于 
Cookie 中 没有 值 ， 所 以 显示 效果 如 图 2-17 所 示 。 


(6) 在 文本 框 中 输入 一 个 新 值 ， 单 击 “ 提 交 ” 按 钮 ， 将 该 值 保存 到 Cookie 中 。 


tp://1loc: st:81 er2/Cook... 
go- E localhost II 
XD MED SEV KERU) IAV WHU 
ARAR |Ø http://Locahost:8125/Chapter.. | | Ñ 7 E 
面 的 信息 是 从 Cookie 中 读 取 

读 取 到 的 Cookie 值 ，Label 读 取 到 的 Cookie 值 ， 无 Cookie 信 息 

输入 新 Cookie 值 ， | ADi Cookiet, (az) 

. w ' w—— J EE ne Aw 


图 2-16 页 面 设 计 与 布局 图 2-17 页 面 初始 效果 图 


(T) 按 F5 键 刷新 页 面 ， 可 以 看 到 页 面 发 生 了 变化 ， 刚 才 保 存 的 Cookie 值 被 读 取出 来 
如 图 2-18 所 示 。 


(8) 接 下 来 ， 在 浏览 器 窗口 中 选择 “工具 ”|“Intermet 选项 ”命令 ,打开 “Intemet 选 
项 ”对 话 框 ， 如 图 2-19 所 示 。 
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下 面 的 信息 是 从 Cookie 中 读 取 的 Paa 
单 击 “ 提 交 " 技 钮 将 把 文本 框 中 的 新 值 写 入 Cookie 中 a= 
= 更 改 网 页 在 选项 卡 中 显示 的 方式 . REN 
读 取 到 的 Cookie 值 ,小 石头 AA 
输入 新 C e praz Ea Ceo Eo CEI | Geo) 
@ Internet far ios ~ (Ra sma 
图 2-18 读 取 到 Cookie f 图 2-19 “Internet 选项 ”对 话 框 


(9) 单 击 “ 浏 览 历史 记录 ”选项 区 域 中 的 “设置 ”按钮 ， 可 以 打开 “Internet 临时 文件 
和 历史 记录 设置 ”对 话 框 ， 如 图 2-20 所 示 。 
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(10) 单 击 “ 查 看 文件 ”按钮 ， 将 打开 Windows 资源 管理 器 ， 同 时 定位 到 Cookie 存放 
的 目录 ， 如 图 2-21 所 示 ， 此 目录 中 有 很 多 文本 文件 和 一 些 图 片 文件 等 ntemet 临时 文件 。 


ern 
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历史 记录 
指定 Internet Explorer 保存 您 访问 过 网 站 列表 的 天 数 。 


网 页 保存 在 历史 记录 中 的 天 数 QO: EM 


CE (wa) 
图 2-20 “Intemet 临时 文件 和 历史 记录 设置 ”对 话 框 图 2-21 打开 Cookie 存放 的 目录 


(11) Cookie 文件 一 般 都 是 以 cookie 打头 ， 以 网 站 域名 为 结尾 的 文件 ， 如 本 例 中 网 站 的 
Cookie 文件 在 笔者 的 电脑 上 是 cookie:administrator@localhost/。 
(12) 双击 Cookie 文件 ， 可 以 通过 文本 编辑 器 打开 并 查看 该 文件 ， 如 图 2-22 所 示 。 


文件 中 MD 格式 四) HEV w50 
hanem h i Ik al1ocalhost /8153681n9017011283021175388100528808302103158=8 


图 2-22 查看 Cookie 文件 


2.2.8 ViewState 对 象 


ViewState( 视 图 状态 ) 对 象 是 Page 对 象 的 一 个 属性 ， 是 状态 管理 中 常用 的 一 种 对 象 ， 可 
以 用 来 保存 页 和 控件 的 值 。 

说 明 : 

视图 状态 中 存储 的 常见 数据 类 型 有 以 下 几 种 ， 分 别 是 字符 串 、 整 数 、 布 尔 值 、Array 
对 象 、ArrayList 对 象 、 哈 希 表 和 泛 型 对 象 等 。 


1. ViewState 简介 


视图 状态 是 ASP.NET 页 框架 默认 情况 下 用 于 保存 往返 过 程 之 间 的 页 面 信息 以 及 控件 
值 的 方法 。 当 呈现 页 的 HTML 形式 时 , 需要 在 回 发 过 程 中 保留 的 页 的 当前 状态 和 值 将 被 序 
列 化 为 Base64 编码 的 字符 串 ， 并 输出 到 视图 状态 的 隐藏 字段 中 。 通 过 实现 自 定义 的 
PageStatePersiste 类 以 存储 页 数据 ， 也 可 以 更 改 默 认 行 为 并 将 视图 状态 存储 到 另 一 个 位 置 ， 
如 SQL Server 数据 库 。 
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程序 员 可 以 通过 使 用 页 面 的 ViewState 属性 将 往返 过 程 中 的 数据 保存 到 Web 服务 器 
端 ， 然 后 利用 自己 的 代码 访问 视图 状态 。ViewState 属性 是 StateBag 类 的 实例 ， 它 是 一 个 
包含 键 / 值 对 的 字典 ， 并 通过 唯一 的 键 名 来 访问 对 应 的 值 。 
使 用 ViewState 可 以 带 来 很 多 方便 ， 但 是 也 有 一 些 需要 注意 的 问题 。 
e 视图 状态 提供 了 特定 ASP.NET 页 面 的 状态 信息 。 如 果 需 要 在 多 个 页 上 使 用 信息 ， 
或 者 需要 在 访问 网 站 时 保留 信息 ， 则 应 当 使 用 另 一 个 方法 (如 应 用 程序 状态 、 会 话 
状态 或 个 性 化 设置 ) 来 维护 状态 。 
e° 视图 状态 信息 将 序列 化 为 XML， 然 后 进行 Base64 编码 ， 这 将 生成 大 量 的 数据 。 将 
页 回 发 到 服务 器 时 ， 如 果 视 图 状态 包含 大 量 信息 ， 则 会 影响 页 的 性 能 。 
o 虽然 使 用 视图 状态 可 以 保存 页 和 控件 的 值 , 但 是 在 某 些 情况 下 , 需要 关闭 视图 状态 。 
如 使 用 GridView 控件 显示 数据 , 单 击 GridView 控件 的 下 一 页 按钮 , 此 时 , GridView 
控件 呈现 的 数据 已 经 不 再 是 前 一 页 的 数据 , 那么 如 果 使 用 视图 状态 将 前 一 页 数据 保 
存 下 来 ， 不 仅 没有 必要 而 且 还 会 生成 大 量 隐藏 字段 ， 增 大 页 面 的 体积 。 
如 果 隐 藏 字段 中 的 数据 量 过 大 ， 某 些 代理 的 防火 墙 将 禁止 访问 包含 这 些 数据 的 页 。 由 
于 所 允许 的 最 大 数据 量 随 所 采用 的 防火 墙 和 代理 的 不 同 而 不 同 ， 因 此 大 量 隐藏 字段 可 能 会 
导致 偶发 性 问题 。 为 了 帮助 避免 这 一 问题 ， 如 果 ViewState 属性 中 存储 的 数据 量 超 过 了 页 
的 MaxPageStateFieldLength 属性 中 指定 的 值 ， 该 页 会 将 视图 状态 拆 分 为 多 个 隐藏 字段 ， 可 
以 使 每 个 单独 字段 的 大 小 在 防火 墙 拒绝 的 大 小 以 下 。 

2. 如 何 关闭 ViewState 

并 不 是 所 有 控件 都 一 直 依赖 于 View State。 有 很 多 控件 能 维持 它们 自己 的 某 些 状态 。 
这 些 控件 包括 TextBox, CheckBox, RadioButton 和 DropDownList。 它 们 能 维持 它们 的 值 ， 
这 是 因为 它们 在 浏览 器 中 被 呈现 为 标准 的 HTML 表单 控件 。 例 如 ，TextBox 服务 器 控件 在 
浏览 器 中 看 起 来 如 下 所 示 : 


<input name="TextBox1" type="text" value="Initial Text" id="TextBox1" /> 


当 发 送 回 一 个 带 有 这 样 的 TextBox 的 页 面 时 ， 浏 览 器 也 会 将 控件 的 值 发 送 回 服务 器 。 
然后 ASP.NET 运行 库 就 能 再 次 用 这 个 值 来 预先 填写 文本 框 ， 而 不 需要 从 ViewState 中 获取 
值 。 显 然 ， 这 也 比 将 值 存储 在 ViewState 中 更 有 效 。 如 果 这 些 值 也 存储 在 ViewState 中 ， 值 
就 会 被 发 送 到 服务 器 中 两 次 : 一 次 在 文本 框 中 ， 另 一 次 在 View State 中 。 当 值 比较 大 时 ， 
就 会 大 大 增加 页 面 的 大 小 ， 增 加 页 面 加 载 的 时 间 。 因 此 ， 在 不 需要 时 最 好 关闭 它 。 这 样 就 
能 最 小 化 隐藏 字段 VIEWSTATE 的 大 小 。 

关闭 ViewState 很 容易 ， 可 以 在 以 下 3 个 地 方 做 到 。 

© 在 Web 站 点 级 别 

可 以 在 根 站 点 的 web.config 文件 (2.3 节 将 详细 介绍 web.config 文件 ) 中 通过 修改 
<system.web> 下 面 的 <pages> 元 素 ， 将 enableViewState 特性 设置 为 false 来 完成 。 
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<pages enableViewState="false"> 


</pages> 


通常 不 在 站 点 级 别 关 闭 ViewState， 因 为 在 站 点 级 别 关 闭 ViewState 后 ， 将 无 法 为 特定 
的 控件 打开 这 个 功能 。 幸 运 的 是 ，ASP.NET 4.0 提供 了 一 个 新 的 属性 ViewStateMode， 它 
提供 了 关于 ViewState 如 何 使 用 的 更 多 控制 。 

e° 在 页 面 级 别 

在 每 个 页 面 的 页 面 指令 中 ， 可 以 将 EnableViewState 设置 为 False， 例 如 : 


<%(@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" 
Inherits=" Default” EnableViewState="False" %> 


对 于 确认 根本 不 需要 View State 的 页 面 来 说 ， 这 种 方法 是 非常 有 用 的 。 

e 在 控件 级 别 

各 个 ASPNET 服务 器 控件 允许 分 别 设置 EnableViewState 属性 ， 这 样 可 以 选择 关闭 某 
些 控件 ， 而 使 其 他 控件 保持 打开 。 

- 且 在 更 高 级 别 (web.config 或 页 面 级 别 ) 上 关闭 了 ViewState， 就 不 能 再 在 一 个 低层 级 

别 (页 面 或 特定 控件 级 别 ) 上 打开 这 个 功能 。 但 是 ， 使 用 新 的 ViewStateMode 属性 仍 能 完成 
如 下 工作 。 

(1) 禁止 在 web.config 文件 中 关闭 View State。 

(2) 在 页 面 级 别 , 将 EnableViewState 设置 为 True, 将 ViewStateMode 设置 为 Disabled， 
如 下 所 示 : 

<%@ Page Language="C#"...EnableViewState="True" ViewStateMode="Disabled" %> 


上 述 代码 可 以 关闭 页 面 中 所 有 控件 的 ViewState ， 除 了 那些 再 次 明确 地 将 
ViewStateMode 属性 设置 为 Enabled 的 控件 以 外 。 

(3) 如 果 想 让 控件 支持 ViewState， 可 以 将 控件 的 ViewStateMode 属性 设置 为 Enabled， 
例如 : 


<asp:Label ID="Labell" runat="server" Text="Label" ViewStateMode="Enabled" /> 


3. 使 用 ViewState 


例 2-8 将 演示 ViewState 的 使 用 。 

例 2-8: 使 用 ViewState 对 象 。 

(1) 启动 VWD 2010， 选 择 “ 文 件 ”|“ 打 开 网 站 ”命令 ， 打 开 网 站 Chapter2。 

(2) 在 网 站 中 添加 一 个 名 为 ViewState.aspx 的 Web 窗 体 。 

(3) 打开 ViewState.aspx 的 设计 视图 ， 添加 三 个 Label 控件 、 两 个 TextBox 控件 和 两 个 
Button 控件 到 Web 窗 体 中 ， 控 件 的 Text 属性 和 页 面 布 局 如 图 2-23 所 示 。 
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姓名 , 三 
职业 : 
保存 ViewState 


读 取 ViewState 
这 里 显示 读 取 的 信息 


图 2-23 页 面 布局 及 控件 的 Text 属性 


(4) 在 页 面 的 后 台 代码 文件 中 添加 页 面 的 Load 事件 和 两 个 按钮 的 单 击 事件 处 理 程序 ， 
代码 如 下 : 


protected void Page Load(object sender, EventArgs e) 


{ 
if (!Page.IsPostBack) 
ú 
ViewState.Add("user", " 赵 艳 铎 "); 
ViewState.Add("vocation", "工程 师 "); 
} 
} 
protected void Button1 Click(object sender, EventArgs e) 
{ 
if (TextBox2.Text != "") 
ViewState["user"] = TextBox1.Text; 
if (TextBox2.Text != "") 
ViewState["vocation"] = TextBox2.Text; 
) 
protected void Button2_Click(object sender, EventArgs e) 
{ 
Label3.Text = "ViewState 信息 如 下 :<br> 姓 名 : "; 
Label3.Text += ViewState["user"]; 
Label3.Text += "<br> 职 业 : " 
Label3.Text += ViewState["vocation"]; 
} 


(5) 编译 并 运行 程序 ， 在 浏览 器 中 打开 ViewState.aspx 页 面 。 单 击 “ 读 取 ViewState” 
按钮 ， 读 取 ViewState 初 值 ， 如 图 2-24 所 示 ; 输入 姓名 和 职业 后 ， 单 击 “ 保 存 ViewState” 
按钮 , 然后 再 次 单 击 “ 读 取 ViewState” 按 钮 ， 读 取 ViewState 的 新 值 , 效果 如 图 2-25 所 示 。 


localhost :8125/Chapt, p Goa wt ei JOE 
[GO z. aa 引 Trelier w 
IRO MMD EEV PRAW IRD #MV IFD SD FEV WERW IAD HMD 
RERA Erp Needs B-B a KPRI |Æ http: //Locdaest:51Z5/Chapterz/Vi. ü] 
姓名 : 

Rk. 

VewSiae 

vee 

MT 

姓名 ， 起 格 

职业 : = 

[= 了 = a- Am j far AIO ~ 


K 2-24 读 取 视图 状态 初 值 图 2-25 IR ViewState 中 的 新 值 
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23 ASP.NET 配置 管理 


使 用 ASPNET 配置 系统 的 功能 ， 可 以 配置 整个 服务 器 上 的 所 有 ASP.NET 应 用 程序 、 
单个 ASP.NET 应 用 程序 和 各 个 页 面 或 应 用 程序 子 目 录 ， 也 可 以 配置 各 种 具体 的 功能 ， 如 
身份 验证 模式 、 页 缓存 、 编 译 器 选项 、 自 定义 错误 、 调 试 和 跟踪 选项 等 。 


2.3.1 web.config 文件 


每 一 个 Web 应 用 程序 都 包含 一 个 web.config 配置 文件 ， 该 配置 文件 为 ASPNET 提供 
了 各 种 基础 的 设置 。 

web.config 是 一 份 XML 文件 ,配置 文件 的 全 部 内 容 都 嵌 套 在 根 元 素 <configuration> 中 。 
W Web 应 用 程序 相关 设 定 的 XML 标记 ， 可 用 来 简化 ASP.NET 应 用 程序 的 相关 设 定 。 

web.config 文件 位 于 Web 应 用 程序 的 任何 目录 中 ， 统 一 命名 为 web.config, CWE T 
所 在 目录 及 其 子 目录 的 配置 信息 ， 并 且 子 目 录 下 的 配置 信息 会 覆盖 其 父 目 录 的 配置 ， 即 子 
目录 如 果 没 有 web.config 文件 ， 就 继承 父 目录 web.config 文件 的 相关 设 定 ; 如 果子 日 录 有 
web.config 文件 , 就 会 覆盖 父 目录 web.config 文件 中 的 相关 设 定 。 在 运行 状态 下 , ASP.NET 
会 根据 远程 URL 请 求 , 把 访问 路 径 下 的 各 个 web.config 配置 文件 县 加 , 产生 一 个 唯一 的 配 

举例 来 说 ， 对 URL: http://localhost/website/ownconfig/test.aspx 的 访问 ，ASP.NET 会 根 
据 以 下 顺序 来 决定 最 终 的 配置 情况 。 

e .\Microsoft.NET\Framework\{version}\web.config( 默 认 配 置 文件 ) 

e .\webapp\web.config( 应 用 的 配置 ) 

e .\webapp\ownconfig\web.config( 自 己 的 配置 ) 


1. 配置 文件 的 语法 规则 


web.config 的 全 部 内 容 都 被 置 于 标记 <configuration> 和 </configuration> 之 间 。 在 XML 
标记 的 属性 就 是 设 定 值 ， 标 记名 称 和 属性 值 格式 是 字符 串 ， 第 一 个 开头 字母 是 小 写 ， 之 后 
每 一 个 字 的 首 字母 大 写 ， 例 如 <appSetting>。Web 配置 文件 的 范例 如 下 所 示 。 


<configuration> 
<appSettings> 
<add key="dbType" value="Access Database"/> 
</appsettings> 
<connectionsStrings> 
<add name="provider" connectionString="Microsoft.Jet. OLEDB.4.0;"/> 
<add name="database" connectionString="/chapter5/student.mdb"/> 
</connectionsStrings> 
<system.web> 
<sessionState cookieless="false" timeout="10"/> 
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<compilation defaultLanguage="C#" debug="true"/> 
<globalization fileEncoding="gb2312" requestEncoding="gb2312" culture= "zh-CN"/> 
<customErrors mode="RemoteOnly"/> 


</system.web> 
</configuration> 


可 以 看 到 ， 这 上段 配置 信息 是 一 个 基于 XML 格式 的 文件 ， 根 标记 是 <configuration>， 所 
有 的 配置 信息 均 被 包括 在 <configuration> 及 </configuration> 标 签 中 间 ， 其 子 标记 
<appSettings>、<connectionsStrings> 和 <system.web> 是 各 设 定 区 段 。 在 <system.web> 下 的 设 
定 区 段 属于 ASP.NET 相关 设 定 ， 常 用 的 区 段 标记 如 表 2-17 所 示 。 


表 2-17_ 常 用 设 定 区 段 标记 说 阴 


i = P E H g 
<anonymousIdentification> 控制 Web 应 用 程序 的 匿名 用 户 
<authentication> 设 定 ASP.NET 的 验证 方式 
<authorization> 设 定 ASP.NET 用 户 授 权 


<browserCaps> 
<compilation> 
<customErrors> 
<globalizations> 
<httpHandlers> 


<httpModules> 


设 定 浏览 程序 兼容 组 件 HttpBrowserCapabilities 

设 定 ASP.NET 应 用 程序 的 编译 方式 

设 定 ASP.NET 应 用 程序 的 自动 错误 处 理 

关于 ASP.NET 应 用 程序 的 全 球 化 设 定 ， 也 就 是 本 地 化 设 定 

设 定 HTTP 处 理 是 对 应 到 URL 请 求 的 HttpHandler 类 

创建 、 删 除 或 清除 ASP.NET 应 用 程序 的 HTTP 模块 

设 定 ASPNET HTTP 运行 时 的 配置 ， 这 些 配置 决定 如 何 处 理 对 


<httpRuntime> ME aa s 
ASP.NET 应 用 程序 的 请 求 
Samik 设 定 在 使 用 窗 体 基础 验证 的 Cookie 数据 时 ， 用 来 加 码 和 解码 的 金 
钥匙 
<membership> BGE ASP.NET 的 Membership 机 制 
<pages> BUE ASP.NET 程序 的 相关 设 定 ， 即 Page 指引 命令 的 属性 
<profile> 设 定 个 人 化 信息 的 Profile 对 象 
<roles> 设 定 ASP.NET 的 角色 管理 
<sessionState> 设 定 ASP.NET 应 用 程序 的 Session 状态 HttpModule 
<siteMap> 设 定 ASP.NET 网 站 导航 系统 
<webParts> 设 定 ASP.NET 应 用 程序 的 网 页 组 件 
<webServices> 设 定 ASP.NET 的 Web 服务 


2. 在 <appSettings> 中 创建 用 户 变量 


在 Web 配置 文件 的 <appSettings> 区 段 可 以 创建 ASP.NET 程序 所 需 的 参数 , 每 个 <add> 
标记 可 以 创建 一 个 参数 ， 属 性 key 是 参数 名 称 ，value 是 参数 值 。ASP.NET 2.0 新 增 了 
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<connectionStrings> 区 段 ， 可 以 指定 数据 库 连接 字符 串 ， 在 <connectionStrings> 标 记 的 <add> 
子 标记 也 可 以 创建 数据 库 连 接 字 符 串 ， 属 性 name 是 名 称 ，connectionStrings 是 连接 字符 串 
的 值 。 

说 明 : 

<connectionStrings> 标 记 的 使 用 将 在 第 5 章 介绍 。 下面 举例 说 明 <appSettings> 中 参数 的 
创建 与 使 用 。 


在 Web EE PER oppa mar 区 段 通 过 <add> 标 记 创建 的 参数 ， 在 程序 中 可 以 使 用 
System.Web.Configuration 命名 空间 的 WebConfigurationManager 类 来 获取 。 

例 2-9: 在 web.config 的 <appSettings> 区 段 中 创建 和 使 用 用 户 变 量 。 

(1) 启动 VWD 2010， 选 择 “文件 ”|“ 打 开 网 站 ”命令 ， 打 开 网 站 Chapter2。 

(2) 在 网 站 中 添加 一 个 名 为 AppSettings.aspx 的 Web 窗 体 。 在 <form> 标 记 上 方 添加 如 
下 提示 性 文本 : 


<h3> 读 取 web.config 中 <% =Server.HtmlEncode("<appSettings>"). %> 中 配置 的 用 户 变量 </h3> 


(3) 切换 到 AppSettings.aspx 的 设计 视图 ， 添 加 一 个 Label 控件 到 Web 窗 体 中 。 
(4) 打开 web.config 文件 ， 在 <appSettings> 配 置 子 节点 中 添加 一 个 变量 ， 代 码 如 下 : 


<appSettings> 
<add key="MyParam" value=" 金 百合 拉丁 舞 培 训 学 校 "/> 
</appSettings> 
技巧 : 


如 果 web.config 文件 中 没有 <appSettings> 标 记 ， 则 可 以 自行 添加 ， 将 其 包含 在 
<configuration> 标 签 下 即 可 。 
(5) 打开 后 台 代 码 文件 AppSettings.aspx.cs， 首 先 在 上 方 添加 using 语句 ， 引 入 所 需 的 
命名 空间 : 
using System. Web.Configuration; 
(6) 接着 ， 添 加 页 面 的 Load 事件 处 理 程序 ， 代 码 如 下 : 


protected void Page Load(object sender, EventArgs e) 


{ 
Labell.Text= "用 户 变量 的 值 为 : "二 
WebConfigurationManager.AppSettings["MyParam"]; 
) 


(7) 编译 并 运行 程序 ， 在 浏览 器 中 打开 AppSettings.aspx 页 面 ， 如 图 2-26 所 示 。 
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 éwstp://localhost:8125/Chapter2/AppSetti... [~ |D ËJ 


@- = localhost PI: 
文件 EE) REO SEV BRRW IAV #R Q 
A BRR Æ http://ocslhost:81. -09 - c “| 


读 取 web.config 中 <appSettings> 中 配置 的 用 户 变量 ^ 
用 户 变量 的 值 为 ， 全 百合 拉丁 舞 培训 学 校 


@ Internet 


图 2-26 页 面 运行 效果 
3. 在 sessionState 区 段 设置 Session 状态 


ASP.NET 的 Session 状态 管理 拥有 扩展 性 ， 可 以 在 web.config 文件 的 <sessionState> 区 
段 设 定 Session 状态 管理 ， 该 区 段 属于 <system.web> 子 标记 。 其 常用 属性 如 表 2-18 所 示 。 


表 2-18 <sessionState> 区 段 的 常用 属性 


属 性 Ho 
i Session 状态 存储 的 模式 ， 可 以 是 off( 不 存储 )、InProc( 使 用 Cookie)、StateServer( 使 用 
状态 服务 器 ) 和 SqlServer( 存 储 在 SQL Server 中 ) 
cookieless 是 否 使 用 Cookie 存储 Session RÆ. True 表示 不 使 用 ，False 表示 使 用 
à i Session 时 间 的 期 限 ， 以 分 钟 计算 ， 默 认为 20 分 钟 ， 与 Session 对 象 的 TimeOut 属性 
imeoui 


功能 相同 
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作为 网 络 应 用 程序 ， 在 执行 之 前 有 时 需要 初始 化 一 些 重要 的 变量 ， 而 且 这 些 工作 必须 
发 生 在 所 有 程序 执行 之 前 ，Global.asax 文件 便 是 为 此 目的 而 设计 的 。 

Globalasax 是 ASP.NET 应 用 程序 的 “全 局 应 用 程序 类 ”， 该 文件 是 应 用 程序 用 来 保 
持 应 用 程序 级 的 事件 、 对象 和 变量 的 。 一 个 ASP.NET 应 用 程序 只 能 有 一 个 Globalasax 文件 。 

注意 : 

Global.asax 存放 的 位 置 是 固定 的 ， 必 须 存 放 在 当前 应 用 所 在 的 虚拟 目录 的 根 目 录 下 。 
如 果 放 在 虚拟 目录 的 子 目录 中 ，Global.asax 文件 将 不 会 起 任何 作用 。 


1. 创建 Global.asax 文件 


Global.asax 文件 是 Web 应 用 程序 的 系统 文件 ， 属 于 选项 文件 ， 可 有 可 无 。 当 需要 使 用 
Application 和 Session 对 象 的 事件 处 理 程序 时 ， 就 需要 创建 此 文件 。 

在 VWD 2010 中 通过 “添加 新 项 ”对 话 框 就 可 以 创建 Global.asax 文件 ， 在 “模板 ” 选 
项 中 选择 “全 局 应 用 程序 类 ”选项 即 可 。 


。S8 。 


说 明 : 
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如 果 网 站 已 经 创建 了 Global.asax 文件 ， 则 “添加 新 项 ”对 话 框 中 就 看 不 到 “全 局 应 用 


程序 类 ”模板 了 。 


Globalasax 文件 主要 是 定义 Web 应 用 程序 的 Application Start) Application End()、 
Session_Start0 和 Session End0 等 事件 处 理 程序 。 按照 VWD 模板 添加 的 Globalasax 如 下 所 示 。 


<%@ Application Language="C#"%> 


<script runat="server"> 


void Application Start(object sender,EventArgs e) 


{ 


/在 应 用 程序 启动 时 运行 的 代码 


) 


void Application End(object sender, EventArgs e) 


{ 


/在 应 用 程序 关闭 时 运行 的 代码 


} 


void Application_Error(object sender, EventArgs e) 


{ 


/在 出 现 未 处 理 的 错误 时 运行 的 代码 


} 


void Session_Start(object sender, EventArgs e) 


{ 


// 在 新 会 话 启动 时 运行 的 代码 


} 
</script> 


在 窗 体 页 中 ， 只 能 处 理 单个 页 面 的 事件 ， 而 在 Global.asax 文件 中 则 可 以 处 理 整个 应 用 
旦 序 中 的 事件 。 除 了 上 述 代码 模板 中 列举 的 事件 ， 在 Globalasax 文件 中 还 可 以 加 入 其 他 事 
件 的 处 理 函 数 。 表 2-19 列 出 了 可 以 在 Global.asax 中 处 理 的 事件 。 


事件 


Application AuthenticateRequest 


表 2-19 ”Global.asax 中 可 以 处 理 的 事件 

Ho 
每 个 请 求 都 会 触发 该 事件 ， 并 且 可 以 在 此 函数 中 设置 自 定义 的 
验证 


Application BeginRequest 


虽然 在 VWD 的 代码 模板 中 没有 该 事件 的 处 理 ， 不 过 可 以 在 
Global.asax 中 添加 。 该 事件 是 在 每 个 请 求 到 达 服 务 器 ， 并 且 在 
处 理 该 请 求 前 ， 会 触发 的 事件 


Application End 


应 用 程序 关闭 时 触发 该 事件 。 该 函数 很 少 使 用 , 因为 ASP.NET 
可 以 很 好 地 关闭 和 清除 内 存 对 象 


Application Error 


在 应 用 程序 中 抛 出 任何 错误 时 都 会 触发 该 事件 。 通 常 在 此 函数 
中 提供 应 用 程序 级 的 错误 处 理 或 者 记录 错误 事件 
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事件 


Application Start 


Session Start 


Session End 


( 续 表 ) 
描 述 
在 应 用 程序 接收 到 第 一 个 请 求 时 调用 ， 通常 在 此 函数 中 定义 应 
类 似 于 Application_Start, 不 过 是 针对 每 个 客户 端 第 一 次 访问 应 
用 程序 时 调用 
以 进程 内 模式 使 用 会 话 状态 时 ， 如 果 用 户 离开 应 用 程序 将 会 触 
发 该 事件 


与 页 面 指令 一 样 ，Global.asax 文件 也 可 以 使 用 应 用 程序 指令 ， 这 些 指令 都 可 以 包含 特 
定 于 该 指令 的 一 个 或 多 个 属性 / 值 对 。 下 面 列 出 了 ASP.NET 中 支持 的 应 用 程序 指令 。 


指令 只 能 在 Global.asax 文件 中 使 用 。 
e @Import: 显 式 将 命名 空间 导入 到 应 用 程序 中 。 
© @Assembly: 在 分 析 时 将 程序 集 链接 到 应 用 程序 。 


2. 使 用 Global.asax 文件 


例 2-10: 演示 Global.asax 文件 的 使 用 ， 同 时 回顾 前 面 介绍 的 内 置 对 象 的 使 用 。 
(1) 启动 VWD 2010， 选 择 “ 文 件 ”|“ 打 开 网 站 ”命令 ， 打 开 网 站 Chapter2 。 
(2) 在 网 站 中 添加 “全 局 应 用 程序 类 ”Global.asax。 

(3) 在 Globalasax 文件 中 添加 如 下 代码 : 


<script runat="server"> 


void Application Start(object sender, EventArgs e) 


{ 


/ 在 应 用 程序 启动 时 运行 的 代码 
Application["info"] = "开始 Application...<br/>" 


} 


void Application End(object sender, EventArgs e) 


{ 


// 在 应 用 程序 关闭 时 运行 的 代码 


} 


void Application Error(object sender, EventArgs e) 


{ 


/ 在 出 现 未 处 理 的 错误 时 运行 的 代码 


} 


void Session Start(object sender, EventArgs e) 


{ 


Response. Write(Application["info"].ToString0); 
Application["info"] = "";/4 ° Application 变量 
Response. Write(" 开 始 Session...<br/>"); 
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} 
void Session End(object sender, EventArgs e) 
Í 
Application["info"] = "结束 Session...<br/>"; 
} 
void Application BeginRequest(object sender, EventArgs e) 
d 
Response. Write(" JF 4f Request...<br/>"); 
} 
void Application EndRequest(object sender, EventArgs e) 
| 
Response.Write(" 结 束 Request...<br/>"); 
} 
</script> 


提示 : 
此 时 ， 再 访问 本 章 前 面 创建 的 所 有 页 面 都 将 发 生变 化 ， 页 面 的 顶端 和 最 下 端 至 少 会 增 
加 “开始 Request ...” 和 “结束 Request ...” 信 息 。 


(4) 为 了 更 全 面 地 了 解 各 个 事件 的 发 生 顺 序 ， 再 添加 一 个 名 为 testGlobal.aspx 的 Web 
窗 体 。 打开 该 页 面 的 设计 视图 , 添加 两 个 Button 控件 到 Web 窗 体 中 ，Text 属性 分 别 为 “ 刷 
新 ”和 “结束 会 话 ”。 

(5) 在 testGlobal.aspx 页 面 的 <body> 标 记 中 添加 如 下 代码 : 


<body> 
页 面 内 容 … 
(<% if (Session.IsNewSession) 
Response.Write(" 新 的 Session 时 间 "); 
else 
Response.Write(" 同 一 个 Session 时 间 "); 
%>) 
<form id="form1" runat="server"> 
<div> 
<asp:Button ID="Button1" runat="server" Text=" 刷 新 " onclick="Button1 Click" />&nbsp; 
<asp:Button ID="Button2" runat="server" Text=" 结 束 会 话 " onclick="Button2 Click" /> 
</div> 
</form> 
</body> 


(6) 在 后 台 代码 文件 中 添加 页 面 的 Load 事件 和 按钮 的 单 击 事件 处 理 程序 ， 代 码 如 下 : 


protected void Page Load(object sender, EventArgs e) 


{ 
Response.Write(" 加 载 页 面 ..<br/>"); 
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protected void Button1_Click(object sender, EventArgs e) 


{ 
Response.Write(" 刷 新 页 面 ...<br/>"); 
} 
protected void Button?2 Click(object sender, EventArgs e) 
{ 
Session .Abandon0:// 结 束 Session 
Response.Redirect("testGlobal.aspx"); 
} 


(7) 编译 并 运行 程序 ， 在 浏览 器 中 打开 testGlobal.aspx 文件 ， 效 果 如 图 2-27 所 示 。 从 
运行 结果 可 以 看 出 事件 处 理 程序 的 执行 顺序 。 

(8) 单 击 “刷新 ”按钮 ， 由 于 此 时 Session 尚未 结束 ， 所 以 页 面 内 容 显示 的 是 “同一 个 
Session 时 间 ”， 如 图 2-28 所 示 。 


GO gə- 图 ttr: //1ocalhost:8125/Chapter2/testGlobal. aspa [ag] 
文件 中 RED SEV ERW IAD HHW XED RED FEV KARA IAW HHW 
fÆ http: //Localhost:8125/Chapter2/test. . Ü | ARER |Æ http://Localhost:8125/Chapter2/te... | | Ñ 


E) http://localhost:8125/Chapter2/testGlobal. aspx] |M] 


开始 Session RIRE.. 
MENM... 页 面 内容 . (同一 个 Session 时 间 ) 
页 面 内 容 … (新 的 Session 时 间 ) 


oe 


结束 Request ... 


结束 Request .… 


@ Internet 


图 2-27 页 面 初 次 加 载 效果 图 2-28 刷新 页 面 


(9) 单 击 “结束 会 话 ” 按 钮 ， 因 为 在 程序 中 以 Abandon() 方 法 强制 结束 Session 事件 ， 
然后 重新 加 载 页 面 ， 可 以 看 到 ， 此 次 显示 的 为 新 的 Session 时 间 ， 如 图 2-29 所 示 。 


gə- Æ) bttp //localhost pter2/test p | x 
文件 @) RED SEV KERA IAY HW 
Hr RER fÆ http://localhost:8125/Chapter2/te. ü- 9 


开始 Request .. 

tAE Session 

开始 Session .. 

加 载 页 面 … 

页 面 内 容 … (新 的 Session 时 间 ) 
结束 Request .… 


图 2-29 结束 会 话 重 新 加 载 页 面 
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本 章 全 面 讲 述 了 ASP.NET 的 基础 知识 。 首 先 ， 介 绍 了 ASP.NET 应 用 程序 的 文件 类 型 
及 其 目录 结构 。 接 下 来 ， 对 ASP.NET 的 内 置 对 象 分 别 进行 了 详细 讲解 ， 这 些 对 象 在 今后 
的 开发 和 学 习 过 程 中 会 经 常用 到 ， 理 解 并 掌握 内 置 对 象 的 使 用 有 助 于 我 们 开发 出 安全 健壮 
的 应 用 程序 。 最 后 ， 讨 论 了 ASP.NET 的 配置 管理 ， 包 括 web.config 文件 和 Global.asax 文 
件 ， 正 确 使 用 配置 文件 可 以 给 我 们 的 开发 工作 带 来 很 多 便利 。 掌 握 本 章 的 内 容 是 后 续 学 习 
的 基础 ， 下 一 章 将 开始 Web 窗 体 的 设计 开发 ， 重 点 介绍 ASP.NET 的 服务 器 控件 和 用 户 控 
件 的 使 用 。 


2.5 思考 和 练习 


1. App_Code 目录 和 bin 目录 有 什么 区 别 ? 

2. 简 述 加 载 页 面 时 ，Page 类 各 事件 的 发 生 顺 序 。 

3. Response.Redirect() 和 Server.Transfer() 方 法 都 能 实现 页 面 的 重 定向 , 二 者 有 何 区 别 ? 

4. 对 于 HTML 表单 ， 使 用 Get 方法 或 Post 方法 提交 数据 有 什么 区 别 ? 

5. 在 例 2-2 中 的 Response.aspx 页 面 中 ， 输 出 的 QueryString 集合 字符 串 中 出 现 了 很 多 
奇特 的 字符 ， 这 是 为 什么 ? 如 何 让 它 正 确 显示 提交 的 中 文 数据 ? 

6. 新 建 一 个 网 站 ， 通 过 Application 对 象 统计 网 站 的 访问 人 数 。 

7. web.config 文件 是 什么 格式 的 ? 该 配置 文件 包含 哪些 配置 的 设置 。 

8. Global.asax 文件 的 作用 是 什么 ? 
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ASP.NET 服务 器 控件 是 ASP.NET 网 页 上 的 对 象 ,使 用 ASP.NET 服务 器 控件 , 可 以 大 

幅 减 少 开发 Web 应 用 程序 所 需 编写 的 代码 量 ， 提 高 开发 效率 和 Web 应 用 程序 的 性 能 。 
ASP.NET 服务 器 控件 的 体系 结构 已 经 完全 集成 到 了 ASP.NET 中 ， 为 用 户 提 供 了 一 个 在 当 
今 构 建 Web 站 点 的 技术 中 相当 独特 的 功能 集 。 本 章 将 介绍 这 些 服务 器 控件 的 基本 用 法 以 及 
不 同类 别 控件 的 功能 。 这 些 控件 在 每 个 ASP.NET 应 用 程序 中 都 会 用 到 。 因 此 ， 了 解 工具 
箱 中 有 哪些 控件 可 用 、 它 们 各 自 的 用 途 、 它 们 的 工作 原理 以 及 它们 如 何 维持 自身 状态 非常 
关键 。 
章 学 习 目标 : 

ASP.NET 服务 器 控件 的 概念 和 工作 原理 

服务 器 控件 的 基 类 和 常用 事件 

列表 控件 的 使 用 

各 种 验证 控件 的 功能 和 用 法 

使 用 ASP.NET 的 导航 控件 

如 何 创建 和 使 用 用 户 控件 

为 用 户 控件 添加 属性 
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在 网 页 上 经 常 看 到 填写 信息 用 的 文本 框 、 单 选 按 钮 、 复 选 框 和 下 拉 列 表 等 元 素 ， 它 们 
都 是 控件 。 控 件 是 可 重用 的 组 件 或 对 象 ， 有 自己 的 属性 和 方法 ， 可 以 响应 事件 。 

ASP.NET 服务 器 控件 是 服务 器 端 ASP.NET 网 页 上 的 对 象 ， 当 用 户 通 过 浏览 器 请 求 
ASP.NET 网 页 时 ， 这 些 控件 将 在 服务 器 上 运行 ， 并 向 客户 端 呈 现 HTML 标记 。 

在 ASP.NET 页 面 上 ， 服 务 器 控件 表现 为 一 个 标记 ， 例 如 <asp:textbox…/>。 这 些 标记 
不 是 标准 的 HTML 元 素 ， 因 此 如 果 它 们 出 现在 网 页 上 ， 浏 览 器 将 无 法 理解 它们 ， 然 而 ， 当 
从 Web 服务 器 上 请 求 一 个 ASP.NET 页 面 时 ， 这 些 标记 都 将 动态 地 转换 为 HTML 元 素 。 


3.1.1 ASPNET 页 面 的 工作 流程 
ASP.NET 服务 器 控件 是 ASP.NET 的 重要 组 成 部 分 。 在 VWD 中 构建 的 几乎 所 有 页 面 


都 包含 一 个 或 多 个 服务 器 控件 。 这 些 控件 有 各 种 各 样 的 类 型 和 大 小 ， 有 Button 和 Label 这 
样 的 简单 控件 ， 也 有 复杂 的 控件 ， 如 可 以 显示 数据 源 中 数据 的 控件 TreeView 和 GridView. 


.64 。 


在 创建 .aspx 页 面 时 ， 可 以 将 和 
HTML 和 JavaScript 脚本 代码 ， 
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E 意 的 服务 器 控件 添加 到 页 面 中 , 然而 客户 端 浏 览 器 只 能 理解 


因此 ， 当 从 服务 器 上 请 求 一 个 .aspx 页 面 时 ， 服 务 器 控件 都 


会 被 动态 地 编译 转换 为 标准 的 HTML 元 素 。 其 工作 流程 如 图 3-1 所 示 。 


客户 端 浏览 器 


Web 服务 器 


http://server/Default.asp 


Default.aspx 


服务 器 端 代码 


客户 端 代 码 


图 3-1 ASPNET 页 面 的 工作 流程 


3.1.2 ”服务 器 控件 类 


大 多 数 Web 服务 器 控件 类 都 派生 于 System.Web.ULWebControls.WebControl 类 ， 而 
WebControl 类 又 从 System.Web.ULControl 类 派生 而 来 。 
WebControl 类 定义 了 所 有 控件 类 的 一 些 共 同属 性 和 事件 。 


1. 基本 属性 


WebControl 类 是 用 作 定 义 System.Web.ULWebControls 命名 空间 中 的 所 有 控件 的 公 
共 方法 、 属 性 和 事件 的 基 类 。 其 中 定义 了 一 些 可 以 应 用 于 几乎 所 有 服务 器 控件 的 基本 属性 ， 


如 表 3-1 所 示 。 


表 3-1 WebControl 类 的 基本 属性 


属 性 je — Ë 
AccessKey 允许 设置 一 个 键 ， 使 用 这 个 键 ， 就 可 以 按 下 关联 的 字母 在 客户 端 访 问 控件 
BackColor 获取 或 设置 Web 服务 器 控件 的 背景 色 
BorderColor 获取 或 设置 Web 服务 器 控件 的 边框 颜色 
BorderStyle 获取 或 设置 Web 服务 器 控件 的 边框 样式 
BorderWidth 获取 或 设置 Web 服务 器 控件 的 边框 宽度 
CssClass 获取 或 设置 Web 服务 器 控件 在 客户 端 呈 现 的 级 联 样式 表 (CSS) 类 
Enabled 获取 或 设置 是 否 启用 Web 服务 器 控件 ， 默 认 值 为 True 
EnableTheming | 获取 或 设置 是 否 对 Web 服务 器 控件 应 用 主题 
Font 获取 或 设置 Web 服务 器 控件 关联 的 字体 属性 
ForeColor 获取 或 设置 Web 服务 器 控件 的 前 景色 ， 通 常 为 文本 颜色 
Height 获取 或 设置 Web 服务 器 控件 的 高 度 
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( 续 表 ) 
属 性 描 jË 
ID 获取 或 设置 Web 服务 器 控件 的 编号 标识 符 
SkinID 获取 或 设置 应 用 于 Web 服务 器 控件 的 外 观 
Style 获取 或 设置 将 在 Web 服务 器 控件 的 外 部 标记 上 呈现 的 样式 属性 的 文本 属性 的 集合 
Wauqe 设置 客户 端 HTML tabindex 特性 ， 确 定 用 户 按 下 Tab 键 时 焦点 沿 着 页 面 中 控件 移 
动 的 顺序 
A 允许 设置 浏览 器 中 控件 的 工具 提示 。 这 个 工具 提示 在 HTML 中 被 呈现 为 title 特性 ， 
当 用 户 把 鼠标 悬 停 在 相关 的 HTML 元 素 上 时 就 会 显示 出 来 
Visible 获取 或 设置 Web 服务 器 控件 是 否 作为 UI 呈现 在 页 面 上 
Runat 该 属性 设置 为 Server 时 ， 表 示 该 控件 是 一 个 服务 器 控件 
Width 获取 或 设置 Web 服务 器 控件 的 宽度 
在 页 面 上 添加 了 服务 器 控件 之 后 ， 可 以 在 “属性 ”窗口 中 修改 控件 的 属性 ， 也 可 以 在 


“ 源 ” 


视图 中 直接 设置 不 同 的 属性 。 


技巧 : 


更 新 ， 


“属性 ”窗口 在 “ 源 ” 视 图 中 也 是 可 用 的 ， 只 要 简单 地 单 击 某 标 记 , “属性 ”窗口 就 会 
以 反映 输入 的 标记 。 通 过 “属性 ”窗口 设置 的 属性 ， 在 “ 源 ” 视 图 中 也 会 自动 生成 


相应 的 代码 。 


2: 
在 


服务 器 控件 的 事件 
ASP.NET 页 面 中 ， 用 户 与 服务 器 的 交互 是 通过 Web 控件 的 事件 来 完成 的 。 例 如 ， 


当 单 击 一 个 按钮 时 ， 就 会 触发 按钮 的 单 击 事件 ， 程 序 员 只 需 在 该 单 击 事件 处 理 程序 中 编写 


相应 
J 


9 代码， 即 可 对 用 户 的 单 击 行为 做 出 响应 。 
务 器 控件 的 事件 工作 方式 与 传统 的 HTML 标记 的 客户 端 事件 工作 方式 有 所 不 同 , 这 


是 因为 HTML 标记 的 客户 端 事 件 是 在 客户 端 触发 并 处 理 的 , 而 ASP.NET 中 的 Web 控件 的 
事件 虽然 也 是 在 客户 端 触发 ， 但 却 是 在 服务 器 端 处 理 的 。 


Web 控件 的 事件 模型 ， 即 客户 端 捕捉 到 事件 信息 ， 接 着 通过 HTTP POST 将 事件 信息 


发 送 到 服务 器 ， 而 且 页 面 框架 必须 解释 该 POST 以 确定 所 发 生 的 事件 ， 然 后 在 要 处 理 该 事 
件 的 服务 器 上 调用 代码 中 的 相应 方法 。 


基于 以 上 事件 模型 ，Web 控件 事件 可 能 会 影响 到 页 面 的 性 能 ， 因 此 ，Web 控件 仅 提供 


有 限 上 


4 一 组 事件 ， 常 见 的 事件 如 表 3-2 所 示 。 


表 3-2 服务 器 控件 的 事件 


事件 支持 的 控件 描述 
Click | Button、ImageButton 单 击 事件 
TextChanged TextBox 输入 焦点 变化 


SelectedIndexChanged 


DropDownList、ListBox、CheckBoxList、 


选择 项 变化 
RadioButtonList 
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服务 器 控件 通常 不 再 支持 经 常 发 生 的 事件 ， 如 OnMouseover 事件 等 ， 因 为 如 果 在 服务 
器 端 处 理 这 些 事件 , 就 会 浪费 大 量 的 资源 , 但 Web 控件 仍然 可 以 为 这 些 事件 调用 客户 端 处 
理 程序 。 此外, 控件 和 页 面 本 身 在 每 个 处 理 步骤 都 会 触发 生命 周期 事件 , 如 Init 事件 、 Load 
事件 和 PreRender 事件 ， 在 应 用 程序 中 可 以 使 用 这 些 生 命 周 期 事件 。 

所 有 的 Web 事件 处 理 函数 都 包括 两 个 参数 ， 第 1 个 参数 表示 触发 该 事件 的 对 象 ， 第 2 
个 参数 表示 包含 该 事件 特定 信息 的 事件 对 象 ， 通 常 是 EventArgs 类 型 ， 或 EventArgs 类 型 
的 子 类 型 。 例 如 ， 按 钮 控件 的 单 击 事件 处 理 程序 ， 其 代码 形式 如 下 : 


protected void Button1 Click(object sender, EventArgs e) 
í 

/在 此 添加 处 理 程序 
) 


3. 事件 的 绑 定 
在 处 理 Web 控件 时 , 经 常 需 要 把 事件 绑 定 到 事件 处 理 程序 。 将 事件 绑 定 到 事件 处 理 程 
序 的 方法 有 如 下 两 种 。 
(1) fE ASP.NET 页 面 中 ， 在 声明 控件 时 ， 指 定 该 控件 的 事件 对 应 的 事件 处 理 程序 。 例 
如 ， 把 一 个 Button 控件 的 Click 事件 绑 定 到 名 为 MyClick 的 方法 ， 代 码 如 下 : 
<asp:Button ID="Buttonl" runat="server" Text="Button" onclick="MyClick" /> 
(2) 如 果 控件 是 动态 创建 的 ， 则 需要 通过 编写 代码 动态 地 将 事件 绑 定 到 方法 ， 例 如 : 


Button myBtn = new Button("Button1"); 
myBtn.Text = "提交 "; 
myBtn.Click += new System.EventHandler(ButtonClick): 


在 第 2 章 本 书 曾 介绍 过 在 VWD 中 双击 控件 即 可 添加 控件 的 默认 事件 的 处 理 程序 ， 也 
可 以 在 “属性 ”窗口 的 “事件 ”选项 卡 页 中 添加 具体 的 事件 处 理 程序 。 这 种 操作 其 实 是 上 
面 提 到 的 第 一 种 方法 。 


3.1.3 ”设置 控件 的 颜色 与 字体 


所 有 控件 都 有 设置 颜色 和 字体 的 属性 ， 本 节 我 们 就 来 介绍 如 何 设置 颜色 和 字体 。 
在 .NET 框架 中 ，System.Drawing 命名 空间 提供 了 一 个 Color 类 ， 使 用 它 可 以 设置 控件 的 颜 
色 属 性 。 
创建 颜色 的 方式 有 如 下 3 种 。 
e 使 用 ARGB(alphared,green,blue) 颜 色 值 :可 以 为 每 个 值 指定 一 个 0~255 之 间 的 整数 。 
其 中 ，alpha 表示 颜色 的 透明 度 ， 当 alpha 为 255 时 ， 表 示 完 全 不 透明 ; red 表示 红 
色 ; green 表示 绿色 ; blue 表示 蓝 色 。 
e 使 用 颜色 的 枚 举 值 ， 可 供 使 用 的 颜色 有 140 个 。 
o {EH HTML 颜色 名 : 可 以 使 用 ColorTranslator 类 把 字符 串 转换 为 颜色 值 。 
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例如 ， 下 面 的 代码 都 是 设置 控件 Buttonl 的 背景 色 : 


Button1.BackColor = Color.FromArgb(255,0,99,127); 
Button1.BackColor = Color Red: 
Button1.BackColor = ColorTranslator. FromHtml("Green"); 


控件 的 字体 属性 依赖 于 System.Web.UI.WebControls 命名 空间 中 的 FontInfo 对 象 .该 对 
象 的 常用 属性 如 表 3-3 所 示 。 


表 3-3 Fontlnfo 对 象 的 属性 


属 性 PE 
Narie | 指明 字体 的 名 称 ， 如 Arial 
Names 指明 一 系列 字体 ， 浏 览 器 会 首先 选用 第 一 个 去 匹配 用 户 安装 的 字体 


字体 的 大 小 ， 可 以 设置 为 相对 值 或 者 真实 值 
布尔 属性 ， 用 来 设置 是 否 应 用 给 定 的 样式 特征 。Bold 是 粗 体 ,Italic 为 斜 
体 ，Strikeout 为 中 划 线 ，Underline 为 下 划 线 ，Overline 为 上 划 线 


Size 
Bold, Italic, Strikeout, 


Underline, Overline 


技巧 : 
通常 ， 可 以 直接 在 “属性 ”窗口 中 设置 字体 的 上 述 属 性 。 


3.1.4 ”服务 器 控件 的 类 别 


ASP.NET 4.0 本 身 附 带 了 大 量 的 服务 器 控件 ， 能 够 满足 Web 开发 的 大 部 分 需要 。 为 了 
更 容易 地 找到 正确 的 控件 ， 可 以 将 它们 放 在 工具 箱 的 各 个 单独 的 控件 类 别 中 。 如 图 3-2 所 
示 为 工具 箱 中 的 所 有 可 用 类 别 。 


x 


指针 

CompareValidator 
CustonValidator 

Rangeyali dator 
RegularExpressionValidator 
RequiredFieldValidator 
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ValidationSunmary 


本 登录 

四 WebParts 

DATAY Extensions 
= 

SHL 

SRA 


` 


图 3-2 工具 箱 中 的 控件 类 别 


本 章 将 介绍 标准 控件 、HTML 控件 、 验证 控件 和 导航 控件 , 数据 控件 将 在 第 5 章 介 绍 ， 
登录 控件 将 在 第 7 章 介绍 , AJAX Extensions 控件 将 在 8 章 介绍 , 其 他 控件 的 使 用 本 书 将 不 
做 详细 介绍 。 
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3.2 标准 控件 


标准 类 别 中 包含 很 多 基本 控件 ， 几乎 所 有 的 Web 页 面 都 需要 它们 。 前面 已 经 使 用 过 其 
中 的 一 部 分 ， 如 TextBox, Button 和 Label 控件 。 本 节 将 详细 介绍 这 些 控件 的 功能 和 用 法 。 


3.2.1 简单 控件 


这 里 所 说 的 简单 控件 是 指 简单 易 懂 且 常 用 的 控件 ， 包 括 Label, TextBox, Button, 
HyperLink, LinkButton, ImageButton, RadioButton 和 Checkbox. 


1. Label 控件 


Label 控件 用 来 显示 静态 文本 ， 其 常用 的 属性 主要 有 ID, Text 和 Visible, HP ID 和 
Visible 属性 是 基础 服务 器 控件 基 类 的 ，Text 属性 用 于 指定 Labe 控件 要 显示 的 文本 。 
2. TextBox 控件 


TextBox 控件 显示 为 一 个 输入 文本 框 。 默 认 情 况 下 ， 该 控件 的 TextMode 属性 设置 为 
TextBoxMode.SingleLine ， 即 一 个 单行 文本 框 。 但 也 可 以 将 TextMode 属性 设置 为 
TextBoxMode.MultiLine( 显 示 多 行文 本 框 ， 该 文本 框 将 作为 textarea 元 素 呈 现 ) 或 者 为 
TextBoxMode.Password( 显 示 屏 蔽 用 户 输入 的 文本 框 ， 即 密码 框 )。 通 过 使 用 Text 属性 可 以 
获得 TextBox 控件 中 的 文本 。 

说 明 : 

将 TextMode 属性 设置 为 TextBoxMode.Password 有 助 于 确保 在 输入 密码 时 其 他 人 无 法 
看 到 。 但 是 ， 输 入 到 文本 框 中 的 文本 没有 以 任何 方式 进行 加 密 ， 为 了 提高 安全 性 ， 在 发 送 
带 有 密码 的 页 面 时 ， 可 以 使 用 安全 套 接 字 层 (SSL) 和 加 密 。 


3. 按钮 控件 


按钮 控件 为 用 户 提 供 向 服务 器 发 送 命令 的 功能 ， 它 将 窗 体 提交 给 服务 器 并 使 窗 体 同 任 
何 挂 起 的 事件 一 起 被 处 理 。 
ASP.NET 包括 3 种 按钮 控件 : 标准 按钮 、 超 级 链接 按钮 和 图 形 化 按钮 。 这 3 种 按钮 提 
t 类 似 的 功能 ， 但 具有 不 同 的 外 观 。 
e Button: 显示 一 个 标准 命令 按钮 ， 该 按钮 呈现 为 一 个 HTML input 元 素 。 
e LinkButton: 呈现 为 页 面 中 的 一 个 超 链接 。 但 是 ， 它 包含 使 窗 体 被 发 回 服务 器 的 客 
户 端 脚本 (可 以 使 用 HyperLink 服务 器 控件 创建 真实 的 超 链接 )。 
e ImageButton: 将 一 个 图 形 呈 现 为 按钮 。 这 对 于 提供 丰富 的 按钮 外 观 非 常 有 用 。 
ImageButton 控件 还 提供 有 关 图形 内 已 单 击 位 置 的 坐标 信息 ， 主 要 的 属性 是 
JImageUrl。 


n 
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当 用 户 单 击 任何 按钮 服务 器 控件 时 ， 都 会 将 该 页 发 送 到 服务 器 。 默 认 情 况 下 ， 该 页 回 
发 到 其 本 身 ， 在 这 里 重新 生成 相同 的 页 面 并 处 理 该 页 上 控件 的 事件 处 理 程序 。 可 以 引发 按 
钮 的 Click 事件 ， 为 这 些 事件 编写 事件 处 理 程序 。 

可 以 配置 按钮 来 将 当前 页 面 回 发 到 另 一 页 面 。 这 对 于 创建 多 页 窗 体 可 能 非常 有 用 。 


注意 ; 

默认 情况 下 ，Button 控件 使 用 HTML POST 操作 提交 页 面 . LinkButton 和 ImageButton 
控件 不 能 直接 支持 HTML POST 操作 。 因 此， 使 用 这 些 按钮 时 ， 它 们 将 客户 端 脚 本 添加 到 
页 面 以 允许 控件 以 编程 方式 提交 页 面 (因此 LinkButton 和 ImageButton 控件 要 求 在 浏览 器 上 
启用 客户 端 脚本 )。 


在 某 些 情况 下 ， 可 能 希望 Button 控件 也 使 用 客户 端 脚本 执行 回 发 。 这 在 希望 以 编程 方 
式 操 作 回 发 (如 将 回 发 附加 到 页 面 上 的 其 他 元 素 ) 时 非常 有 用 。 可 以 将 Button 控件 的 
UseSubmitBehavior 属性 设置 为 true 以 使 Button 控件 使 用 基于 客户 端 脚本 的 回 发 。 

Button 控件 既 可 以 引发 服务 器 事件 ， 也 可 以 引发 客户 端 事件 。 服 务 器 事件 在 回 发 后 发 
生 ， 且 这 些 事件 在 为 页 面 编写 的 服务 器 端 代码 中 处 理 。 客 户 端 事件 在 客户 端 脚 本 (通常 为 
ECMAScript(JavaScript)) 中 处 理 ， 并 在 提交 页 面前 引发 。 通 过 向 ASP.NET 按钮 控件 添加 客 
户 端 事件 ， 可 以 执行 一 些 任务 (如 在 提交 页 之 前 显示 确认 对 话 框 以 及 可 能 取消 提交 )。 

4. HyperLink 控件 


HyperLink 控件 用 来 创建 一 个 超 链接 ， 该 控件 在 客户 端 将 呈现 为 一 个 HTML<a> 元 素 ， 
其 常用 的 属性 主要 有 ID、Text、Target 和 NavigateUrl。 其 中 Text 属性 用 于 指定 超 链接 显 
示 的 文本 ，Target 属性 用 于 设置 单 击 超 链 接 时 显示 网 页 的 目标 窗口 或 框架 ，NavigateUrl 属 
性 用 于 指定 链接 的 URL 地 址 。 

5. RadioButton 和 Checkbox 


RadioButton 控件 用 于 显示 一 个 单 选 按 钮 ，CheckBox 控件 用 于 显示 一 个 复 选 框 。 这 两 
个 控件 都 对 应 有 列表 控件 RadioButtonList 和 CheckBoxList， 当 选项 较 多 或 需要 在 运行 时 动 
态 决 定 有 哪些 选项 时 ， 使 用 列表 控件 RadioButtonList 和 CheckBoxList 控件 比较 方便 。 

单 选 按钮 很 少 单独 使 用 ， 而 是 进行 分 组 以 提供 一 组 互 斥 的 选项 。 在 一 个 组 内 ， 每 次 只 
能 选择 一 个 单 选 按钮 ， 可 以 将 所 有 RadioButton 控件 的 GroupName 属性 设置 为 相同 的 组 名 
即 可 将 单 选 按钮 进行 分 组 。 

当 用 户 单 击 RadioButton 或 Checkbox 控件 时 将 引发 CheckedChanged 事件 。 默 认 情 况 
下 ， 这 一 事件 并 不 导致 向 服务 器 发 送 页 面 ， 但 通过 将 AutoPostBack 属性 设置 为 tue， 可 以 
使 该 事件 强制 立即 发 送 。 

6. 使 用 简单 控件 


在 前 面 的 学 习 中 ， 已 经 使 用 过 Label. Button 和 TextBox 控件 了 ， 要 向 页 面 中 添加 服 
务 器 控件 ， 只 需 简单 地 从 工具 箱 中 拖 动 相应 的 控件 到 设计 视图 中 即 可 。 
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下 面 通过 一 个 具体 的 实例 来 看 一 下 简单 服务 器 控件 的 工作 原理 。 

例 3-1: 使 用 简单 服务 器 控件 。 在 本 例 中 ， 将 向 页 面 添加 一 些 简单 控件 。 当 客户 端 通 
过 浏览 器 请 求 该 页 面 时 ， 会 将 这 些 服务 器 控件 转换 为 HTML， 然 后 再 发 送 给 客户 端 。 如 果 
在 浏览 器 中 查看 页 面 的 源 文件 ， 就 能 发 现 这 些 HTML 完全 不 同 于 初始 的 ASPNET 标记 。 

(1) 启动 VWD2010， 选择 “文件 ”|“ 新 建 网 站 ”命令 ， 新建 一 个 空 网 站 Chapter3， 单 
“确定 ”按钮 。 

(2) 选择 “网 站 ” | “添加 新 项 ”命令 ， 打 开 “ 添 加 新 项 ”对 话 框 ， 添 加 一 个 名 为 
Default.aspx 的 Web 窗 体 。 

(3) 切换 到 页 面 的 “设计 ”视图 ， 从 “工具 箱 ” 中 拖 动 本 节 介绍 的 简单 控件 到 Web 窗 
体 中 ， 控 件 的 Text 属性 和 布局 如 图 3-4 所 示 。 

(4) TextBox2 在 此 是 作为 密码 输入 框 的 ， 所 以 需要 设置 其 TextMode 属性 为 Password， 
如 图 3-4 所 示 。 
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图 3-3 窗 体 中 的 控件 布局 图 3-4 设置 TextBox2 的 TextMode 属性 
(5) 设置 两 个 RadioButton 控件 的 GroupName 均 为 gender， 这 样 ， 两 个 单项 按钮 在 同 
-时 刻 只 能 有 一 个 被 选中 。 
(6) 设置 HyperLink 控件 的 NavigateUrl 为 一 个 超 链接 地 址 ， 用 于 打开 注册 协议 。 
(7) 双击 “提交 ”按钮 ， 添 加 按钮 的 单 击 事件 处 理 程序 ， 代 码 如 下 : 


protected void Button1_Click(object sender, EventArgs e) 


í 
if (TextBox1.Text == "" || TextBox2.Text == "") 
Í 
string info = "alert\" 请 输入 姓名 和 密码 ! Vn); "; 
Page.ClientScript.RegisterClientScriptBlock(this.GetType(), "warning", info, true); 
) 
else 
$ 
string str = ""; 
if(CheckBox1.Checked) 
str += "舞蹈 » 
if(CheckBox2.Checked) 
str += "唱歌 "; 


if(CheckBox3.Checked) 
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str += "IB "; 
1f(CheckBox4.Checked) 
sr+= "FE "; 


Response.Redirect(string.Format("success.aspx?user={0}&password={1}&gender={2} 
&favor={3}",TextBox1.Text, TextBox2.Text, RadioButton 1.Checked?" ":" Zç 
",str)); 


} 


这 段 代 码 中 ， 首 先 检查 TextBox 1 和 TextBox 2 中 的 内 容 是 否 为 空 ， 若 为 空 ， 则 通过 
alert 语句 弹出 对 话 框 ， 提 示 用 户 输入 姓名 和 密码 ; 若 不 为 空 ， 则 将 控件 中 的 数据 作为 参数 
传 给 success.aspx 页 面 。 所 以 我 们 还 必须 添加 success.aspx 页 面 。 

(8) 通过 “添加 新 项 ”对 话 框 ， 添 加 一 个 名 为 success.aspx 的 Web 窗 体 。 

(9) 在 success.aspx 页 面 的 Load 事件 中 添加 如 下 代码 : 


protected void Page_Load(object sender, EventArgs e) 

{ 
Response.Write(" 注 册 成 功 ! <br> 注 册 信 息 如 下 : <br> 姓 名 : "); 
Response. Write(Request.QueryString["user"].ToString0); 
Response. Write("<br/> p9: "); 
Response. Write(Request.QueryString["password"].ToString0); 
Response.Write("<br/> 性 别 : "); 
Response. Write(Request.QueryString["gender"].ToString()); 
Response.Write("<br/> 兴 趣 : "); 
Response. Write(Request.QueryString["favor"].ToString0); 

) 


(10) 编译 并 运行 程序 ， 在 浏览 器 中 加 载 页 面 Defaultaspx， 如 图 3-5 所 示 。 如 果 不 输入 
姓名 和 密码 ， 就 单 击 “ 提 交 ” 按 钮 ， 将 弹出 提示 对 话 框 ， 如 图 3-6 所 示 。 


| 
GO o azas x] 
ZO SAD SEV RAW IAV EHO 
ARRA — http://localhost: ü- 
注册 信息 
姓名 ， 来 自 网 页 的 消息 EJ 
密码 ， 
tA: O3 O 女 
ME ORA OAK OME OTF N 人 
加 这 注册 协议 = 
Q mura no am CS 
图 3-5 页 面 效 果 图 3-6 提示 对 话 框 功 


(11) 输入 注册 信息 后 ， 单 击 “ 提 交 ” 按 钮 ， 将 跳 转 到 注册 成 功 页 面 success.aspx， 显 
示 注 册 信 息 ， 如 图 3-7 所 示 。 
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图 3-7 注册 成 功 


下 面 来 看 一 下 服务 器 控件 的 工作 原理 。 当 在 浏览 器 中 请 求 页 面 时 ， 服 务 器 端 控 件 就 由 
ASP.NET 运行 库 (负责 接收 和 处 理 ASPX 页 面 请 求 的 引擎 ) 处 理 。 然 后 控件 就 会 输出 客户 端 
HTML 代码 ， 并 将 其 附加 到 最 终 页 面 输出 的 后 面 。 最 终 出 现在 浏览 器 中 用 来 构建 页 面 的 就 
是 该 HTML 代码 。 例 如 ， 当 首次 加 载 Label 控件 并 请 求 它 的 HTML 时 ， 它 会 返回 下 面 的 
代码 : 


<span id="Labell"> 姓 名 </span> 


从 上 面 这 行 代 码 可 以 看 出 ， 虽 然 使 用 <asp:Label> 语 法 定义 了 Label 控件 ， 但 是 它 最 终 
出 现在 浏览 器 中 的 只 是 一 个 简单 的 <span> 元 素 。 在 <span> 标 记 中 显示 的 是 Label 控 件 的 Text 
属性 值 。 

当 请 求 例 3-1 的 Default.aspx 页 面 后 ， 可 以 通过 “查看 ”|“ 源 文件 ”命令 查看 每 个 控 
件 生成 的 HTML 代码 ， 如 下 所 示 : 


<div> 

<h3> 注 册 信息 </h3> 

<span id="Labell"> 姓 名 : </span> 

<input name="TextBox1" type="text" id="TextBox1" /> 

<br/> 

<span id="Label2"> 密 码 : </span> 

<input name="TextBox2" type="password" id="TextBox2" /> 

<br/> 

<span id="Label3"> 性 别 : </span> 

<input id="RadioButton1" type="radio" name="gender" value="RadioButton1" 
checked="checked" /><label for="RadioButton1"> 男 </label> 

<input id="RadioButton2" type="radio" name="gender" value="RadioButton2" /><label 
for="RadioButton2"> 女 </label> 

<br/> 

<span id="Label4"> 兴 趣 : </span> 

<input id="CheckBox1" type="checkbox" name="CheckBox1" /><label 
for="CheckBox1">#E#ñ</label> 


<input id="CheckBox2" type="checkbox" name="CheckBox2" /><label 
for="CheckBox2"> 唱 歌 </label> 
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<input id="CheckBox3" type="checkbox" name="CheckBox3" /><label 
for="CheckBox3"> 画 画 </label> 

<input id="CheckBox4" type="checkbox" name="CheckBox4" /><label 
for="CheckBox4"> F #</label> 

<br > 

<input type="submit" name="Button1" value=" 提 交 " id="Button1" /> 

&nbsp; 

<a id="HyperLink1" hre 全 "xieyihtm"> 阅 读 注册 协议 </a> 

<br > 

</div> 


3.2.2 ”列表 控件 


标准 类 别 中 有 许多 在 浏览 器 中 表现 为 列表 的 控件 ,这 些 控件 包括 ListBox, DropDownList, 
CheckBoxList、RadioButtonList 和 BulletedList。 要 向 列表 中 添加 项 ， 可 以 在 控件 的 起 始 和 
结束 标记 之 间 定义 <asp:ListItem> 元 素 ， 如 下 面 的 示例 所 示 : 
<asp:DropDownList ID="FavoriteLanguage" runat="server"> 
<asp:ListItem Value="C#">C#</asp:ListItem> 
<asp:ListItem Value="Visual Basic">Visual Basic</asp:ListItem> 


<asp:ListItem Value="CSS">CSS</asp:ListItem> 
</asp:DropDownList> 


DropDownList、RadioButtonList 控件 允许 用 户 一 次 只 能 选择 一 项 。 要 以 编程 方式 查看 
列表 控件 中 当前 活动 和 选中 的 项 ， 可 以 查看 它 的 SelectedValue SelectedItem 或 
SelectedIndex 属性 。SelectedValue 返回 一 个 包含 选中 项 的 值 的 字符 串 ，SelectedIndex 返回 
列表 中 项 基于 0 的 索引 。 

RadioButtonList 控件 不 允许 在 按钮 之 间 插 入 文本 ， 但 如 果 想 将 按钮 绑 定 到 数据 源 ， 使 
用 这 类 控件 将 非常 方便 。 

对 于 允许 多 重 选 择 的 控件 ，CheckBoxList 和 ListBox， 可 以 在 Items 集合 之 间 循 环 ， 并 
且 查看 选中 了 哪些 项 。 在 这 种 情况 下 ，SelectedItem 和 SelectedValue 仅 返 回 列 表 中 第 一 个 
选中 的 项 ， 而 不 是 返回 所 有 选中 项 。 

BulletedList 控件 不 允许 用 户 作 选择 ， 而 不 支持 SelectedValue, SelectedItem 或 
SelectedIndex 这 些 属性 。 

当 列 表 控 件 的 某 个 选项 被 选中 时 ， 该 控件 将 引发 SelectedIndexChanged 事件 。 默 认 情 
况 下 ， 此 事件 不 会 导致 向 服务 器 发 送 页 ， 但 可 以 通过 将 AutoPostBack 属性 设置 为 tue， 强 
制 该 控件 立即 发 送 。 

例 3-2: 演示 列表 控件 的 使 用 。 

(1) 启动 VWD 2010, 打开 网 站 Chapter3， 通 过 “添加 新 项 ”对 话 框 在 该 网 站 中 添加 一 
个 名 为 List.aspx 的 Web 窗 体 页 。 
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(2) 打开 Listaspx 文件 的 “设计 ”视图 ， 从 “工具 箱 ” 中 拖 动 DropDownList、 


RadioButtonList, Che 


ckBoxList, ListBox, BulletedList 控件 各 一 个 到 Web 窗 体 中 ， 控 件 的 


Text 属性 和 布局 如 图 3-8 所 示 。 
Fanon = u ri 
ESTE NE JI r 
厂 美 丽 rS 厂 平凡 乒 光明 厂 明亮 r piae herList BESA 
| @ Numbered CLowerhlpha C Upperhlpha C LowerRoman C UpperRoman C Disc C Circle C Square 


1 
š N <— BulletedList 
5. A 


Eg 


图 3-8 窗 体 中 的 控件 布局 


G) 设置 列表 控件 的 Items 属性 时 ， 可 单 击 “ 属 性 ”窗口 中 Items 属性 右边 的 回 按钮 ， 
如 图 3-9 所 示 。 此 时 将 弹出 “ListItem 集合 编辑 器 ”对 话 框 ， 在 该 对 话 框 中 ， 单 击 “ 添 加 ” 
按钮 ， 然 后 在 Text 和 Value 文本 框 中 输入 相应 的 列表 项 即 可 ， 如 图 3-10 所 示 。 通 过 此 窗 
口 添 加 的 项 将 被 添加 为 控件 的 标记 之 间 的 <asp:ListItem> 元 素 。 


Minana OOOO) 
RAW AREE MEE) 
o| tiete | 外 也 加 区 
| 本 G eza 
引 笑 做 江湖 | = 2 
4 Selected Fade 
Text 倚天 民 龙 记 
Ya 以 天 屠龙记 
EZTS RAD 
(n wa ) 
图 3-9 设置 列表 控件 的 Items 属性 图 3-10 “ListItem 集合 编辑 器 ”对 话 框 


(4) 设置 DropDownList, CheckBoxList 和 RadioButtonList 控件 的 AutoPostBack 属性 。 


选中 某 个 列表 控件 ， 生 


和 击 右上 角 的 箭头 图 标 ， 打 开 控 件 的 “任务 ”菜单 ， 通 过 该 菜单 可 以 


执行 属于 控件 的 大 部 分 常见 任务 。 如 图 3-11 所 示 有 3 个 选项 : 第 一 个 选项 允许 把 控件 与 数 
据 源 绑 定 在 一 起 ， 第 二 个 选项 用 来 编辑 列表 项 ， 与 前 面 设置 Items 属性 相同 ， 最 后 一 个 选 
项 用 来 设置 控件 的 AutoPostBack 属性 。 选 中 这 个 选项 后 , 一 旦 用 户 从 列表 中 选择 了 一 个 新 
项 ， 控 件 就 会 将 它 包含 的 页 面 提交 回 服务 器 。 

(5) 为 DropDownList. CheckBoxList 和 RadioButtonList 控件 添加 SelectedIndexChanged 


事件 处 理 程序 。 首 先 选 中 控件 ， 然 后 在 “属性 ”窗口 中 单 击 轩 工具 按钮 ， 切 换 到 事件 列表 ， 


如 图 3-12 所 示 。 在 相应 的 事件 后 面 的 文本 框 中 双击 即 可 添加 默认 名 称 的 事件 处 理 程序 。 


说 明 : 


本 例 中 ，DropDownList 和 CheckBoxList 控件 的 事件 响应 方法 是 同一 个 ， 即 
DropDownListl_SelectedIndexChanged。 在 该 处 理 方法 中 ， 将 根据 DropDownList 控件 的 选 


项 判断 ListBox 控件 中 


所 显示 的 选项 ， 是 CheckBoxList 控件 中 的 选中 项 还 是 非 选中 项 。 
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图 3-11 列表 控件 的 “任务 ”菜单 图 3-12 为 控件 添加 事件 处 理 程序 


(6) 设置 CheckBoxList 和 RadioButtonList 控件 的 RepeatDirection 属性 为 Horizontal， 
使 选项 水 平 排列 。 

(7) 设置 ListBox 控件 的 SelectionMode 属性 为 Multiple， 以 允许 用 户 进行 多 项 选择 。 

(8) 设置 完 控 件 的 属性 和 事件 后 ， 在 List.aspx 的 “ 源 ” 视 图 中 可 以 看 到 如 下 代码 : 


<div> 

<asp:DropDownList ID="DropDownListl" runat="server" AutoPostBack="True" 
onselectedindexchanged="DropDownList1_SelectedIndexChanged"> 
<asp:ListItem> 选 中 的 复 选项 </asp:ListItem> 
<asp:ListItem> 非 选中 的 复 选项 </asp:ListItem> 

</asp:DropDownList> 

<asp:ListBox ID="ListBox1" runat="server" SelectionMode="Multiple"> 
<asp:ListItem> 根 据 CheckBoxList 动态 生成 </asp:ListItem> 

</asp:ListBox> 

<asp:CheckBoxList ID="CheckBoxList1" runat="server" 
RepeatDirection="Horizontal" 
onselectedindexchanged="DropDownList1_SelectedIndexChanged" 
AutoPostBack="True"> 
<asp:ListItem> 美 丽 </asp:ListItem> 
<asp:ListItem> 芬 芳 </asp:ListItem> 
<asp:ListItem> 平 凡 </asp:ListItem> 
<asp:ListItem> 光 明 </asp:ListItem> 
<asp:ListItem> 明 亮 </asp:ListItem> 
<asp:ListItem> 轩 辕 </asp:ListItem> 

</asp:CheckBoxList> 

<asp:RadioButtonList ID="RadioButtonList1" runat="server" AutoPostBack=" True" 
onselectedindexchanged="RadioButtonList1_SelectedIndexChanged" 
RepeatDirection="Horizontal"> 
<asp:ListItem Selected="True">Numbered</asp:ListItem> 
<asp:ListItem>LowerAlpha</asp:ListItem> 
<asp:ListItem>UpperAlpha</asp:ListItem> 
<asp:ListItem>LowerRoman</asp:ListItem> 
<asp:ListItem>UpperRoman</asp:ListItem> 
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<asp:ListItem>Disc</asp:ListItem> 
<asp:ListItem>Circle</asp:ListItem> 
<asp:ListItem>Square</asp:ListItem> 

</asp:RadioButtonList> 

<asp:BulletedList ID="BulletedList1" runat="server" BorderStyle="Double" 
BulletStyle="Numbered"> 
<asp:ListItem> 射 雕 英雄 传 </asp:ListItem> 
<asp:ListItem> 雪 山 飞 狐 </asp:ListItem> 
<asp:ListItem> 天 龙 八 部 </asp:ListItem> 
<asp:ListItem> 笑 做 江湖 </asp:ListItem> 
<asp:ListItem> 倚 天 屠龙记 </asp:ListItem> 

</asp:BulletedList> 

</div> 


(9) 在 List.aspx.cs 文件 中 ， 添 加 控件 的 事件 处 理 程序 ， 代 码 如 下 : 


protected void DropDownList1_SelectedIndexChanged(object sender, EventArgs e) 


{ 
ListBox1.Items.Clear(); 
if (DropDownList1.SelectedValue == "选中 的 复 选项 ") 
{ 
foreach (ListItem item in CheckBoxListl.Items) 
{ 
if (item.Selected) 
ListBox1.Items.Add(item); 
} 
} 
让 (DropDownListl.SelectedValue == " 非 选 中 的 复 选 项 ") 
{ 
foreach (ListItem item in CheckBoxList1 .Items) 
{ 
if (litem.Selected) 
ListBox1.Items.Add(item); 
} 
} 
} 
protected void RadioButtonListl_SelectedIndexChanged(object sender, EventArgs e) 
{ 


BulletStyle style = (BulletStyle)Enum.Parse(typeof(BulletStyle), 
RadioButtonListl.SelectedValue): 
BulletedListl.BulletStyle = style; 
} 


(10) 编译 并 运行 程序 ， 在 浏览 器 中 加 载 页 面 Listaspx， 如 图 3-13 所 示 , 读者 可 以 选择 
不 同 的 选项 ， 查 看 控件 的 变化 情况 。 
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图 3-13 ”页面 运行 效果 


323 ”容器 控件 


容器 控件 常用 于 以 某 种 方式 将 相关 的 内 容 和 控件 组 合 到 一 起 ， 常 用 的 容器 控件 包括 
Panel, PlaceHolder, MultiView, View 和 Wizard。 例 如 ， 可 以 使 用 PlaceHolder 或 Panel 
控件 同时 隐藏 或 显示 几 个 控件 。 不 用 分 别 隐 藏 每 个 控件 ， 只 需 隐 藏 包含 各 个 控件 和 标记 的 
整个 容器 即 可 。 这 两 个 控件 各 有 优 缺 点 。PlaceHolder 控件 的 好 处 是 它 不 会 向 页 面 发 布 它 自 
己 的 HIML， 因 此 可 以 用 作 容 器 控件 ， 而 不 会 在 最 终 页 面 中 产生 任何 副作用 。 然 而 ， 它 缺 
少 设计 时 支持 ， 因 此 在 VWD 中 难以 在 设计 时 管理 PlaceHolder 内 的 控件 。 而 Panel 控件 允 
许 轻 松 地 访问 所 有 控件 以 及 它 所 包含 的 其 他 内 容 ， 但 是 它 自 己 则 呈现 为 <div> 标 记 ， 因 此 ， 

- 般 常 使 用 Panel 控件 。 

使 用 MultiView 和 View 控件 可 以 制作 出 选项 卡 的 效果 ， MultiView 控件 用 作 一 个 或 多 
个 View 控件 的 外 部 容器 。View 控件 又 可 以 包含 标记 和 控件 的 任何 组 合 。 

如 果 要 切换 视图 , 可 以 使 用 控件 的 ID 或 者 View 控件 的 索引 值 , 在 MultiView 控件 中 ， 
一 次 只 能 将 一 个 View 控件 定义 为 活动 视图 。 如 果 某 个 View 控件 定义 为 活动 视图 ， WAE 
所 包含 的 子 控件 则 会 呈现 到 客户 端 。 可 以 使 用 ActiveViewIndex 属性 或 SetActiveView 方法 
定义 活动 视图 。 

注意 : 

如 果 ActiveViewIndex 属性 为 空 , 则 MultiView 控件 不 向 客户 端 呈现 任何 内 容 。 如 果 活 
动 视 图 设置 为 MultiView 控件 中 不 存在 的 View， 则 会 引发 ArgumentOutOfRangeException 

无 论 是 MultiView 控件 还 是 各 个 View 控件 ， 除 当前 View 控件 的 内 容 外 ， 都 不 会 在 页 
面 中 显示 任何 标记 。 但 是 ， 每 次 呈现 页 面 时 都 会 创建 所 有 View 控件 中 的 所 有 服务 器 控件 
的 实例 ， 并 且 将 这 些 实例 的 值 存 储 为 页 面 视图 状态 的 一 部 分 。 另 外 ， 可 以 将 一 个 主题 分 配 
给 MultiView 或 View 控件 ， 控 件 将 该 主题 应 用 于 当前 View 控件 的 所 有 子 控件 。 
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MultiView 和 Wizard 相似 的 地 方 是 : 它们 人 允许 将 一 个 长 页 面 划分 为 多 个 区 域 。 例 如 ， 
将 某 个 网 上 购物 分 成 多 个 子 步骤 完成 。 区 别 在 于 Wizard 具有 使 用 Previous. Next 和 Finish 
按钮 在 页 面 间 移动 的 内 置 支持 ， 而 MultiView 则 必须 通过 编程 进行 控制 。 

例 3-3: 使 用 容器 控件 。 

(1) 启动 VWD 2010, 打开 网 站 Chapter3, 通过 “添加 新 项 ”对 话 框 在 该 网 站 中 添加 一 
个 名 为 Container.aspx 的 Web 窗 体 页 。 

(2) 打开 Container.aspx 文件 的 “设计 ”视图 ， 从 “工具 箱 ” 中 拖 动 一 个 CheckBox 控 
件 和 一 个 Panel 控件 到 Web 窗 体 中 ， 然 后 在 Panel 中 添加 一 个 Label 控件 ， 切 换 到 “ 源 ” 
视图 ， 修 改 其 HTML 代码 如 下 : 


<asp:CheckBox ID="CheckBox1" runat="server" 
oncheckedchanged="CheckBox1_CheckedChanged" Text=" 显 示 Panel 控件 " 
AutoPostBack="True" /> 
<asp:Panel ID="Panell" runat="server" Visible="False"> 
<asp:Label ID="Labell" runat="server" Text=" 我 是 Panel 控件 中 的 Label 控件 
"></asp:Label> 
</asp:Panel> 


(3) 接着 ， 输 入 文本 信息 “MnultiView 与 View 控件 演示 …”， 然 后 添加 一 个 
RadioButtonList 控件 和 一 个 MultiView 控件 ， 在 RadioButtonList 控件 中 添加 3 个 选项 : 
Viewl 、View2 、View3 。 设 置 RadioButtonList 控件 的 AutoPostBack 属性 为 True, 
RepeatDirection 属性 为 Horizontal， 并 为 其 添加 SelectedIndexChanged 事件 处 理 程序 。 

(4) 在 MultiView 控件 中 添加 3 个 View 控件 ,分别 单 击 3 个 View 控件 ,在 每 个 View 
控件 中 分 别 输入 不 同 的 文本 ， 以 区 分 不 同 的 View 控件 ， 如 “这 是 Viewl 控件 ”、“ 这 是 
View2 控件 ”和 “这 是 View3 控件 ”。 切换 到 “ 源 ” 视 图 ， 其 HTML 代码 如 下 : 


<h4>MultiView 与 View 控件 演示 .…</h4> 
<asp:RadioButtonList ID="RadioButtonList1" runat="server" 
RepeatDirection="Horizontal" AutoPostBack="True" 
onselectedindexchanged="RadioButtonList]_SelectedIndexChanged"> 
<asp:ListItem Value="0">View1</asp:Listltem> 
<asp:ListItem Value="1">View2</asp:ListItem> 
<asp:ListItem Value="2">View3</asp:ListItem> 
</asp:RadioButtonList> 
<asp:MultiView ID="MultiView1" runat="server"> 
<asp:View ID="View1" runat="server"> 
这 是 Viewl 控件 
</asp:View> 
<asp:View ID="View2" runat="server"> 
这 是 View2 控件 
</asp:View> 
<asp:View ID="View3" runat="server"> 
这 是 View3 控件 
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</asp:View> 
</asp:MultiView> 


(5) 最 后 ， 添 加 一 个 Wizard 控件 。 单 击 控件 右上 角 的 箭头 打开 “Wizard 任务 ”面板 ， 
选择 “添加 /删除 WizardSteps” 命 令 ， 如 图 3-14 所 示 。 将 打开 “WizardStep 集合 编辑 器 ” 
对 话 框 ， 如 图 3-15 所 示 。 

(6) 单 击 对 话 框 左边 “成 员 ” 列 表 中 名 为 Stepl 的 第 一 个 WizardStep， 将 它 的 Title 属 
性 修改 为 “选择 银行 ”， 将 第 二 步 的 Title 设置 为 “输入 银行 卡 信息 ”， 将 第 三 步 设置 为 

“O s 
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图 3-14 “Wizard 任务 ”面板 图 3-15 “WizardStep 集合 编辑 器 ”对 话 框 


(7) 将 第 二 步 的 StepType 设置 为 Finish， 第 三 步 的 StepType 设置 为 Complete。 可 以 让 
第 一 步 的 StepType 保持 为 Auto。 单 击 “确定 ” 按 钮 ， 关 闭 “WizardStep 集合 编辑 器 ”对 
话 框 。 

(8) 在 “设计 ”视图 中 ， 单 击 左边 列表 中 的 “选择 银行 ”， 让 它 成 为 活动 步骤 ， 然 后 
添加 一 个 DropDownList 控件 到 Wizard 控件 中 ， 并 添加 支持 的 银行 信息 。 

注意 : 

向 Wizard 控件 中 添加 其 他 控件 时 ， 需 要 将 控件 拖 到 Wizard 右上 角 的 灰色 拢 形 框 内 ， 
否则 控件 最 后 不 会 出 现在 Wizard 内 。 

(9) 用 同样 的 方法 ， 在 “输入 银行 卡 信息 ”步骤 中 添加 相应 的 控件 ， 如 图 3-16 所 示 ， 
在 “完成 ”步骤 中 添加 一 个 Label 控件 ， 用 于 显示 提示 信息 。 


Ey| =l | 
图 3-16 “输入 银行 卡 信息 ”步骤 的 设计 视图 


(10) 当 用 户 单 击 向 导 最 后 一 步 的 “完成 ”按钮 时 需要 进行 相应 的 事件 处 理 。 打 开 控 件 
的 “属性 ”面板 ， 选 择 “ 事 件 ” 选 项 卡 。 定 位 并 双击 Action 类 别 中 的 FinishButtonClick， 
为 其 添加 事件 处 理 程序 。 
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protected void Wizardl FinishButtonClick(object sender, WizardNavigationEventArgs e) 


t 
Label2.Text= " 你 好 ， 支 付 信息 如 下 : <br> 银 行 : ": 
Label2.Text += DropDownList1.SelectedValue; 
Label2 Text += "<br/> 卡 号 : "; 
Label2 Text += TextBox1.Text + "<br> 密 码 : "; 
Label2.Text += TextBox2. Text; 

} 


(11) 为 复 选 框 控件 添加 CheckedChanged 事件 处 理 程序 ， 代 码 如 下 : 


protected void CheckBox1_CheckedChanged(object sender, EventArgs e) 
{ 

Panell .Visible = CheckBox1.Checked; 
} 


(12) 为 RadioButtonList 控件 添加 SelectedIndexChanged 事件 处 理 程序 ， 代 码 如 下 : 
protected void RadioButtonListl_SelectedIndexChanged(object sender, EventArgs e) 
{ 


MultiView1.ActiveViewIndex = Int32.Parse(RadioButtonList].SelectedValue); 
} 


(13) 编译 并 运行 程序 ， 在 浏览 器 中 加 载 页 面 Container.aspx， 通 过 “显示 Panel 控件 ” 
复 选 框 可 以 显示 或 隐藏 Panel 控件 , 通过 RadioButtonList 控件 的 选项 可 以 显示 不 同 的 View 
控件 。 

(14) 在 Wizard 控件 中 的 每 个 步骤 中 选择 并 输入 相应 的 信息 ， 然 后 单 击 “ 完 成 ”按钮 ， 
在 “完成 ”步骤 中 将 显示 前 面 两 步 中 选择 的 支付 信息 ， 如 图 3-17 所 示 。 


r 
| 


GO- E Localhost w] 
XED REO SEV BERW IAD Wo 
ARER | 大 Mtp://locdhost ll a-a “ 
CERP? 

我 是 Pane 上 控件 中 的 Label 控 件 


MultiView 与 View 控 件 演示 .… 


OViewl @View2 O View3 
这 是 View2 控 件 

你 好 ， 支 付 信息 如 下 ， 
银行 ， 招 商 银行 

卡号 ，6226090101159999 
密码 ，123110 


<l 


@ Internet 


图 3-17 页 面 运行 效果 
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324 其 他 标准 控件 


除了 前 面 介绍 的 简单 控件 、 列 表 控 件 和 容器 控件 ， 标 准 控件 中 还 有 很 多 其 他 控件 。 它 
们 的 用 法 也 都 类 似 ， 在 此 只 对 这 些 控件 做 简单 介绍 。 
1. Image 和 ImageMap 


这 两 个 控件 用 于 在 浏览 器 中 显示 图 像 。ImageMap 允许 在 图 像 上 定义 “热点 ”， 当 单 
时， 要 么 引起 一 个 到 服务 器 的 回 发 ， 要 么 导航 到 另 一 个 页 面 。 

Image 服务 器 控件 使 用 户 可 以 在 ASP.NET 网 页 上 显示 图 像 , 并 用 自己 的 代码 管理 这 些 
图 像 。 可 以 在 设计 时 或 运行 时 以 编程 方式 为 Image 对 象 指 定 图 形 文件 。 还 可 以 将 控件 的 
ImageUrl 属性 绑 定 到 一 个 数据 源 ， 以 根据 数据 库 信 息 显示 图 形 。 该 控件 比较 特殊 的 一 点 是 
它 不 支持 任何 事件 。 

ImageMap 控件 由 两 个 元 素 组 成 。 一 个 是 图 像 ， 它 可 以 是 任何 标准 Web 图 形 格式 的 图 
形 ， 如 .gif、.jpg 或 .png 文件; 另 一 个 元 素 是 HotSpot( 热 点 ) 控 件 的 集合 。 每 个 热点 控件 都 是 


pL 


-个 类 型 为 CircleHotSpot, RectangleHotSpot 或 PolygonHotSpot 的 不 同 项 。 对 于 每 个 热点 
控件 ， 都 要 定义 用 于 指定 该 热点 的 位 置 和 大 小 的 坐标 。 例 如 ， 要 创建 一 个 CircleHotSpot 
控件 ， 则 需要 定义 圆心 的 x # y 坐标 以 及 圆 的 半径 。 

每 一 个 热点 都 可 以 是 一 个 单独 的 超 链接 或 回 发 事件 。 可 以 指定 用 户 单 击 热点 时 发 生 的 
事件 , 可 以 将 每 个 热点 配置 为 可 以 转 到 为 该 热点 提供 的 URL 的 超 链 接 。 或者， 也 可 以 将 控 
件 配置 为 在 用 户 单 击 某 个 热点 时 执行 回 发 。 回 发 会 引发 ImageMap 控件 的 Click 事件 。 在 事 
件 处 理 程序 中 ， 可 以 读 取 分 配给 每 个 热点 的 唯一 值 。 


2. AdRotator 


这 个 控件 允许 在 Web 站 点 上 显示 随机 广告 。 这 些 广告 来 自在 服务 器 上 创建 的 XML 文 
件 。 每 次 刷新 页 面 时 都 将 更 改 显 示 的 广告 。 广 告 可 以 加 权 以 控制 广告 条 的 优先 级 别 ， 这 可 
以 使 某 些 广告 的 显示 频率 比 其 他 广告 高 。 也 能 编写 在 广告 间 循 环 的 自 定义 逻辑 。 

该 控件 可 显示 .gif 文件 或 其 他 图 形 图 像 。 当 用 户 单 击 广 告 时 ， 系 统 会 将 它们 重 定向 到 
指定 的 URL。 

AdRotator 控件 的 所 有 属性 都 是 可 选 的 。XML 文件 中 可 以 包括 下 列 属性 。 

e ImageUrl: 要 显示 的 图 像 的 URL. 

e NavigateUrl: 单 击 AdRotator 控件 时 要 跳 转 到 的 网 页 URL, 

e AlternateText: 图 像 不 可 用 时 显示 的 文本 。 

e Keyword: 可 用 于 筛选 特定 广告 的 广告 类 别 。 

e Impressions: 一 个 指示 广告 的 可 能 显示 频率 的 数值 (加 权 数 值 )。 在 XML 文件 中 ， 

所 有 Impressions 值 的 总 和 不 能 超过 2 048 000 000-1。 

è Height: 广告 的 高 度 ， 以 像素 为 单位 。 

o Width: 广告 的 宽度 ， 以 像素 为 单位 。 

下 面 的 例子 将 使 用 AdRotator 控件 显示 一 些 大 学 的 广告 信息 ， 当 用 户 单 击 广 告 时 ， 系 
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统 会 导航 到 指定 的 目标 URL. 

例 3-4: 使 用 AdRotator 控件 。 

(1) 启动 VWD 2010, 打开 网 站 Chapter3， 通 过 “添加 新 项 ”对 话 框 在 该 网 站 中 添加 一 
个 名 为 AdRotator.aspx 的 Web 窗 体 页 。 

(2) 在 网 站 根 目录 下 新 建 名 为 Images 的 文件 夹 ,将 准备 好 的 广告 图 片 复制 到 该 文件 夹 中 。 

(3) 在 “解决 方案 资源 管理 器 ”窗口 中 右 击 项 目 名 称 ， 选 择 “ 添 加 ASP.NET 文件 夹 ”| 
App_Data 命令 , 添加 App_Data 文件 夹 , 然后 右 击 App_Data, 从 弹出 的 快捷 菜单 中 选择 “ 添 
加 新 项 ”命令 ， 打 开 “ 添 加 新 项 ”对 话 框 ， 如 图 3-18 所 示 ， 可 以 看 到 ， 这 个 “添加 新 项 ”对 
话 框 中 可 选 的 模板 文件 都 是 与 数据 文件 相关 的 ， 在 此 选择 “XML 文件 ”选项 。 


WINA - E: AASP.WET4VE3GAChapter3N "JE 
| asua BFR kua v Í 2] 
Me Q ADMIT ntitybject EE AM: Viua cz 

r a — 

B so sever 数据 库 

B aro 

G C7 EERS 

[id m e | 
国文 本 文件 
AWW: XMFile. xml 
[=] 


图 3-18 “添加 新 项 ”对 话 框 
(4) 向 广告 信息 文件 中 添加 如 下 XML 元 素 : 


<?xml version="1.0" encoding="utf-8" ?> 

<Advertisements xmlns="http://schemas.microsoft.com/AspNet/AdRotator-Schedule-File"> 

<Ad> 
<ImageUrl>~/images/tsinghua.jpg</ImageUrl> 
<NavigateUrl>http://www.tsinghua.edu.cn</NavigateUrl> 
<AltermnateText> 清 华 大 学 </AltemateText> 
<Impressions>100</Impressions> 

</Ad> 

<Ad> 
<ImageUrl>-/images/pku.gif</ImageUrl> 
<NavigateUrl>http://www.pku.edu.cn</NavigateUrl> 
<AlternateText> 北 京 大 学 </AlternateText> 
<Impressions>50</Impressions> 

</Ad> 

<Ad> 
<ImageUrl>~/images/zju.jpg</ImageUrl> 
<NavigateUrl>http://www.zju.edu.cn</NavigateUrl> 
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<AlternateText> 浙 江 大 学 </AlternateText> 
<Impressions>100</Impressions> 

</Ad> 

<Ad> 
<ImageUrl>~/images/nju.jpg</ImageUrl> 
<NavigateUrl>http://www.nju.edu.cn</NavigateUrl> 
<AltemateText> 南 京 大 学 </AltemateText> 
<Impressions>50</Impressions> 

</Ad> 

</Advertisements> 


(5) 打开 AdRotator.aspx 文件 的 “设计 ”视图 ， 在 网 页 上 要 显示 广告 的 位 置 添加 一 个 
AdRotator 控件 ， 单 击 控件 右上 角 的 小 三 角 ， 弹 出 “AdRotator 任务 ”面板 ， 单 击 “ 选 择 数 
据 源 ”下 拉 列 表 ， 选 择 “< 新 建 数据 源 >” 选 项 ， 如 图 3-19 所 示 。 

(6) 在 打开 的 “数据 源 配置 向 导 ” 对 话 框 中 选择 “XML 文件 ”数据 源 ， 如 图 3-20 所 示 。 


C triR3EN T S x] 
+ 选择 数据 源 类 型 
应 用 程序 从 哪 时 获取 数 蜂 0)? 
te ERAR EA 
Mes RIE Entity Lm kl 数据 库 MH 
ES uL 文件 
HRRARE DM0) 
einwtsmresl 
asp:adrotator #AdRotator 1 
z AdRotator 任务 
882848: 于) 回 
[FE | 
an em D s= A w | 


图 3-19 “AdRotator 任务 ”面板 图 3-20 “数据 源 配置 向 导 ” 对 话 框 


(7) 单 击 “ 确 定 ”按钮 ， 打 开 “ 配 置 数据 源 ” 对 话 框 ， 单 击 “ 数 据 文件 ”后 面 的 “ 浏 
览 ”按钮 ， 选 择 刚 才 创 建 的 XML 文件 ， 如 图 3-21 所 示 。 
CEC 
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图 3-21 “配置 数据 源 ” 对 话 框 


(8) 编译 并 运行 程序 ， 在 浏览 器 中 打开 AdRotator aspx 页 面 ， 按 F5 键 或 者 单 击 工具 栏 
的 “刷新 ”按钮 ， 刷 新 页 面 ， 可 以 看 到 页 面 中 将 显示 不 同 的 图 片 。 
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3. Calendar 


Calendar 控件 提供 了 一 个 功能 丰富 的 接口 ， 人 允许 用 户 选择 日 期 。 
4. FileUpload 


FileUpload 控件 允许 用 户 上 传 可 以 存储 在 服务 器 上 的 文件 。 
5. HiddenField 


HiddenField 控件 可 用 来 将 数据 存储 在 各 个 请 求 提交 的 页 面 中 。 如 果 希 望 页 面 记 住 特定 
数据 ， 而 用 户 在 页 面 中 又 不 会 看 到 ， 那 么 该 控件 就 很 有 有 用。 由 于 这 个 字段 会 显示 在 页 面 的 
HTML 源 代 码 中 ， 因 此 终端 用 户 可 以 访问 ， 所 以 不 要 在 其 中 存储 任何 敏感 数据 。 

6. Literal、Localize 和 Substitute 


这 3 个 控件 看 起 来 有 些 像 Label 控件 ,因为 它们 都 可 以 显示 静态 文本 或 HTML, Literal 
最 大 的 优点 是 它 本 身 不 呈现 额外 的 标记 ; 它 仅 显 示 赋 予 Text 属性 的 信息 ， 因 此 对 于 显示 
HTML 或 者 显示 在 Code Behind 中 构建 的 或 从 数据 库 检 索 的 JavaScript 非常 有 用 。 

Literal 控件 常用 的 属性 是 Mode 属性 ， 该 属性 用 于 指定 控件 对 用 户 所 添加 的 标记 的 处 
理 方式 。 可 以 将 Mode 属性 设置 为 : Transform( 将 对 添加 到 控件 中 的 任何 标记 进行 转换 ， 
以 适应 请 求 浏览 器 的 协议 )、PassThrough( 添 加 到 控件 中 的 任何 标记 都 将 按 原 样 呈 现在 浏览 
器 中 ) 和 Encode( 使 用 HtmlEncode 方法 对 添加 到 控件 中 的 任何 标记 进行 编码 , 这 会 将 HTML 
编码 转换 为 其 文本 表示 形式 )。 

Localize 控件 用 在 使 用 多 种 语言 的 Web 站 点 中 ， 并 且 能 够 从 翻译 后 的 资源 文件 中 检索 
其 内 容 。Substitute 控件 用 在 高 级 缓存 场景 中 ， 并 且 人 允许 仅 更 新 部 分 没有 完全 缓存 的 页 面 。 

7. Table 


<asp:Table> 控 件 在 很 多 方面 等 同 于 HTML<table> 元 素 。 然 而 ， 由 于 该 控件 位 于 服务 器 
因此 可 以 对 它 进行 编程 ， 动 态 地 创建 新 的 列 和 行 ， 以 及 向 其 中 添加 动态 数据 。 
8. XML 


XML 控件 允许 将 数据 从 XML 格式 转换 为 另 一 种 格式 (如 XHTML), 以 便 显 示 在 页 面 上 。 


3.3 HTML 控件 


工具 箱 的 HTML 类 别 中 包含 许多 HTML 控件 ， 它 们 看 起 来 与 标准 类 别 中 的 控件 很 相 
f. DHH, Input (Button) 控 件 看 起 来 就 很 像 <asp:Button> 。 类 似 地 ，Select 控件 有 
<asp:DropDownList> 和 <asp:ListBox> 作 为 它 的 对 应 控件 。 

在 VWD 2010 中 ， 从 工具 箱 添加 到 页 面 上 的 HTML 控件 只 是 已 设置 了 某 些 属性 的 
HTML 元 素 ， 当 然 也 可 通过 输入 HTML 标记 在 “ 源 ” 视 图 中 创建 HTML 元 素 。 
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3.3.1 HTML = 


默认 情况 下 ，ASP.NET 文件 中 的 HTML 元 素 将 被 作为 文本 进行 处 理 ， 并 且 不 能 在 服 
务 器 端 代码 中 引用 这 些 元 素 ， 只 能 在 客户 端 通过 javascript 和 vbscript 等 脚本 语言 来 控制 。 
工具 箱 的 HTML 选项 卡 上 提供 了 一 些 基于 HTML INPUT 元 素 的 控件 。 常 用 的 HTML 
INPUT 元 素 是 Input (Button) 控 件 和 Input (Text) 控 件 。 

Input(Button) 元 素 的 主要 功能 是 创建 一 个 用 来 触发 事件 处 理 程序 的 按钮 ， 通 过 使 用 
onclick 属性 来 表明 单 击 按钮 可 以 触发 的 处 理 方法 。 其 主要 属性 如 下 。 

。 ID: 此 控件 的 编程 名 称 。 

o value: 设置 按钮 中 显示 的 文字 。 

e 按钮 控件 ， 默认 情况 下 是 “INPUT type="button" 元 素 ”。 

文本 框 控件 ， 默 认 情 况 下 是 “INPUT type="text" 元 素 ”。 

Input(Texb 元 素 创 建 允 许 用 户 在 其 中 输入 文本 或 密码 的 单行 文本 框 ， 其 主要 属性 如 下 。 

e@ Type=text/password: 文本 框 的 类 型 。 

e MaxLength: 文本 框 中 最 大 的 输入 字 节 。 

© Size: 设 定 文本 框 的 宽度 。 

© Value: 设 定 文本 框 的 值 。 


3.3.2 HTML 服务 器 控件 


默认 情况 下 ，ASPNET 文件 中 的 HTML 元 素 被 视 为 传递 给 浏览 器 的 标记 ， 作 为 文本 
进行 处 理 ， 不 能 在 服务 器 端的 代码 中 引用 这 些 元 素 。 若 要 使 这 些 元 素 能 以 编程 方式 进行 访 
问 , 可 以 通过 添加 runat="server" 属 性 表明 应 将 HTML 元 素 作为 服务 器 控件 进行 处 理 , 这 样 
就 可 使 用 基于 服务 器 的 代码 对 其 进行 编程 引用 了 。 

添加 了 属性 runat="server" H HTML 元 素 就 转换 为 HTML 服务 器 控件 了 。 移 除 控件 标 
记 中 的 runat="server" JS tE, HTML 服务 器 控件 就 转换 为 HTML 元 素 。 
工具 箱 的 HTML 类 别 中 就 是 HTML 服务 器 控件 ， 标 准 控件 和 HTML 控件 之 间 似 乎 有 
iE, fH AE HTML 控件 的 功能 比 标准 类 别 中 的 控件 的 功能 少 得 多 。 一 般 来 说 ， 标 准 类 
别 中 的 真正 服务 器 控件 提供 了 更 多 的 功能 ， 无 论 是 在 VWD 中 的 设计 时 支持 方面 还 是 在 运 
行 时 能 做 的 事情 方面 都 是 如 此 。 不 过 这 种 功能 是 有 代价 的 。 因 为 它们 增加 了 复杂 度 ， 所 以 
处 理 服务 器 控件 会 多 花 一 点 时 间 。 然 而 , 在 大 多 数 Web 站 点 上 , 可 能 不 会 注意 到 这 一 差别 。 
只 有 在 高 通信 量 的 Web 站 点 ， 且 在 页 面 上 有 很 多 控件 时 ， 使 用 HTML 控件 才 会 提供 稍 好 
一 些 的 性 能 。 


说 明 : 

在 大 多 数 情况 下 ， 人 们 更 愿意 使 用 服务 器 控件 而 不 是 与 它们 对 应 的 HTML 控件 。 因为 
服务 器 控件 提供 了 更 多 的 功能 ， 在 页 面 中 更 灵活 ， 可 以 给 用 户 带 来 更 丰富 的 体验 。 而且 有 
比较 好 的 设计 时 支持 ， 因 此 值得 选择 。 如 果 十 分 确信 不 需要 服务 器 控件 提供 的 这 些 功能 ， 
则 可 以 选择 HTML 控件 。 
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通常 ，Internet 上 的 多 数 Web 站 点 都 要 处 理 来 自用 户 的 输入 。 为 了 防止 系统 接收 无 效 
数据 ， 在 允许 系统 使 用 之 前 要 先 验 证 数据 的 有 效 性 。 男 一 方面 ， 一 旦 站 点 发 布 到 Internet 
上 ， 就 可 能 会 成 为 恶意 用 户 和 黑客 的 入 侵 目标 。 因 此 ， 在 将 数据 用 于 应 用 程序 之 前 验证 数 
据 的 有 效 性 格外 重要 。 

ASP.NET4 为 开发 人 员 提供 了 一 套 完整 的 服务 器 控件 来 验证 用 户 输入 的 信息 是 否 有 
效 ， 这 些 控件 可 与 ASP.NET 网 页 上 的 任何 控件 (包括 HTML 和 服务 器 控件 ) 一 起 使 用 。 


34.4 验证 控件 简介 


ASP.NET 提供 的 6 个 有 效 性 验证 控件 中 ，5 个 控件 用 来 执行 实际 的 有 效 性 验证 ， 而 最 
后 一 个 控件 ValidationSummary 用 来 向 用 户 提供 页 面 中 出 现 的 错误 的 反馈 信息 。 

有 效 性 验证 控件 最 出 色 的 是 它们 能 在 客户 端 和 服务 器 上 检查 输入 。 当 向 Web 页 面 中 添 
加 一 个 有 效 性 验证 控件 时 , 控件 就 会 呈现 在 客户 端 验证 关联 控件 有 效 性 的 JavaScript。 大 多 
数 启用 了 JavaScript 的 现代 Web 浏览 器 (包括 IE, Firefox, Chrome, Opera 和 Safari) 都 能 进 
行 这 种 客户 端 有 效 性 验证 。 同 时 ， 有 效 性 验证 也 可 以 在 服务 器 上 自动 进行 。 这 样 就 容易 向 
用 户 提供 关于 使 用 客户 端 脚本 的 数据 的 即时 反馈 , 从 而 使 Web 页 面 在 服务 器 上 免 受 伪 数 据 
的 侵扰 。 

如 表 3-4 所 示 列 出 了 ASP.NET 提供 的 验证 控件 及 其 功能 说 明 。 


3 3-4 ASP.NET 验证 控件 


使 用 的 控件 
验证 一 个 必 填 字段 ， 如 果 该 字段 没 填 ， 那 么 将 不 能 提 
交 信 息 
将 用 户 输入 与 一 个 常数 值 或 者 另 一 个 控件 或 特定 数据 
类 型 的 值 进 行 比较 (使 用 小 于 、 等 于 或 大 于 等 比较 运算 
符 )， 同 时 也 可 以 用 来 校 验 控件 中 内 容 的 数据 类 型 ， 如 
整形 、 字 符 串 型 等 。 如 密码 和 确认 密码 两 个 字段 是 否 
相等 

RangeValidator 控 件 可 以 用 来 判断 用 户 输入 的 值 是 否 在 
某 一 特定 范围 内 。 可 以 检查 数字 对 、 字 母 对 和 日 期 对 


必 选 项 RequiredFieldValidator 


与 某 值 的 比较 CompareValidator 


j = S asss 限定 的 范围 。 属 性 MaximumValue 和 MinimumValue 
用 来 设 定 范围 的 最 大 和 最 小 值 
它 根据 正则 表达 式 来 验证 用 户 输入 字段 的 格式 是 否 
Ağ af 7A apa 等 。 a 
模式 匹配 pl 合法 ,如 电子 邮件 、 身份 证 和 电话 号 码 等 。 ControlTo 


Validate 属性 选择 需要 验证 的 控件 ，ValidationExpression 
属性 则 编写 需要 验证 的 表达 式 的 样式 
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( 续 表 ) 
验证 类 型 说 阴 
使 用 自己 编写 的 验证 逻辑 检查 用 户 输入 。 此 类 验证 能 
用 户 定义 CustomValidator 够 检查 在 运行 时 派生 的 值 。 在 运行 定制 的 客户 端 
JavaScript EÈ VBScript 函数 时 ， 可 以 使 用 这 个 控件 
该 控件 不 执行 验证 ， 但 该 控件 会 将 本 页 所 有 验证 控件 
验证 汇总 ValidationSummary 的 验证 错误 信息 汇总 为 一 个 列表 并 集中 显示 ， 列 表 的 
显示 方式 由 DisplayMode 属性 设置 


1. 验证 控件 的 共有 属性 

前 5 个 验证 控件 基本 上 都 继承 自 同 一 个 基 类 ， 因 此 它们 有 一 些 共同 的 行为 ，5 个 有 效 
性 验证 控件 中 的 4 个 以 相同 的 方式 操作 ， 并 包含 允许 验证 关联 控件 的 内 置 行为 ， 
CustomValidator 控件 则 允许 用 户 编写 非 内 置 的 自 定义 功能 。 如 表 3-5 所 示 为 有 效 性 验证 控 
件 共 有 的 常用 属性 。 


表 3-5 有 效 性 验证 控件 的 共有 属性 


属 性 说 了 明 
该 属性 确定 隐藏 的 错误 消息 是 否 占用 空间 。 如 果 将 Display 设置 为 Static， 错 误 
Display 消息 就 会 占用 屏幕 空间 ， 即 使 在 隐藏 时 也 是 如 此 。 如 果 设 置 为 None， 则 看 不 到 
错误 消息 
CssClass 这 个 属性 允许 设置 应 用 到 错误 消息 文本 的 CssClass 特性 
这 个 属性 保存 用 在 ValidationSummary 控件 中 的 错误 消息 。 当 Text 属性 为 空 时 ， 
ErrorMessage 
也 用 ErrorMessage 值 作为 出 现在 页 面 上 的 文本 
a Text 属性 用 作 有 效 性 验证 控件 显示 在 页 面 上 的 文本 。 它 可 以 是 一 个 星 号 (9) 以 表 


示 出 现 一 个 错误 ， 也 可 以 是 具体 的 文本 信息 
ControlToValidate 这 个 属性 包含 需要 验证 有 效 性 的 控件 的 IJD 
EnableClientScript 这 个 属性 用 于 确定 控件 是 否 提供 客户 端的 有 效 性 验证 ， 默 认为 True 


这 个 属性 确定 客户 端 脚本 是 否 将 焦点 放 在 产生 错误 的 第 一 个 控件 上 ， 默 认 值 为 
SetFocusOnEITOT 
False 


有 效 性 验证 控件 可 以 组 合 在 一 起 ， 人 允许 对 选中 的 控件 进行 有 效 性 验证 。 同 一 个 
ValidationGroup ValidationGroup 中 的 所 有 控件 都 会 被 同时 检查 , 这 意味 着 如 果 控 件 不 是 这 个 控件 
组 的 一 部 分 ， 就 不 对 它 进行 有 效 性 验证 

通常 在 设计 时 不 会 设置 这 个 属性 , 不 过 在 运行 时 它 提供 关于 是 否 通过 了 有 效 性 验 
证 测试 的 信息 


IsValid 


乍 一 看 ，Text 和 ErrorMessage 属性 的 作用 似乎 是 一 样 的 。 它 们 都 可 以 用 来 以 错误 消息 
的 形式 向 用 户 提供 反馈 。 但 是 ， 当 与 ValidationSummary 控件 结合 起 来 使 用 时 ， 两 者 之 间 
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就 有 了 细微 的 区 别 。 当 同时 设置 这 两 个 属性 时 ，Validation 控件 显示 Text 属性 ， 而 
ValidationSummary 控件 则 显示 ErrorMesage 属性 。 

2. RangeValidator 控件 

RangeValidator 控件 允许 检查 一 个 值 是 否 落 在 特定 的 范围 内 。 这 个 控件 能 检查 字符 串 、 
数字 、 日 期 和 货币 等 数据 类 型 。 除 了 上 述 共 有 属性 之 外 ，RangeValidator 控件 还 有 其 他 几 
个 重要 属性 ， 如 表 3-6 所 示 。 


表 3-6 ”RangeValidator 控件 的 重要 属性 


属 性 说 BB 
a 该 属性 确定 可 接受 的 最 小 值 。 例 如 ， 当 检查 1 和 10 之 间 的 整数 时 ， 将 该 属性 设置 
MinimumValue 
为 1 
该 属性 确定 可 接受 的 最 大 值 。 例 如 ， 当 检查 1 和 10 之 间 的 整数 时 ， 将 该 属性 设置 
MaximumValue 
为 10 
该 属性 确定 有 效 性 验证 控件 检查 的 数据 类 型 。 可 以 设置 为 String、Integer、Double、 
ype 


Date 或 Currency 来 检查 各 自 的 数据 类 型 


3. CompareValidator 控件 


CompareValidator 控件 能 用 来 比较 一 个 控件 的 值 与 男 一 个 控件 的 值 。 它 通常 用 在 注册 
表单 中 ， er 以 确保 两 次 输入 的 密码 相同 。 也 可 以 不 与 男 一 个 控件 作 
比较 ， 而 是 与 一 个 常量 值 比较 。CompareValidator 控件 的 其 他 属性 如 表 3-7 所 示 。 


表 3-7 CompareValidator 控件 的 其 他 属性 
说 明 
该 属性 包含 验证 器 要 与 之 比较 的 控件 ID。 设 置 了 该 属性 ，ValueToCompare 就 无 
效 了 
该 属性 确定 比较 操作 的 类 型 。 如 ， 当 Operator 设置 为 Equal 时 ， 两 个 控件 都 必须 
包含 验证 器 认为 有 效 的 同一 个 值 。 类 似 地 ， 还 有 一 些 选项 ， 如 NotEqual、 
GreaterThan 和 GreaterThanEqual， 用 来 执行 不 同 的 有 效 性 验证 操作 
该 属性 确定 有 效 性 验证 控件 检查 的 数据 类 型 。 可 以 设置 为 String、 Integer、 Double, 
Date 或 Currency 来 检查 各 自 的 数据 类 型 
该 属性 允许 定义 一 个 要 比较 的 常量 值 。 它 通常 用 在 必须 输入 Yes 这 样 的 单词 的 协 
议 中 ， 表 示 同 意 某 些 条 件 。 只 要 将 ValueToCompare 设置 为 单词 Yes， 并 将 
ControlToValidate 设置 为 要 验证 有 效 性 的 控件 ， 就 可 以 了 


属 性 


ControlToCompare 


Operator 


Type 


ValueToCompare 


4. CustomValidator 和 ValidationSummary 控件 


CustomValidator 控 件 允 许 为 客 户 端 ( 用 JavaScripD 和 服务 器 (用 VBNET 或 C 鸭 编写 自 定 
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义 的 有 效 性 验证 函数 。 这 样 在 要 验证 有 效 性 的 数据 和 要 应 用 的 规则 方面 就 有 了 相当 大 的 灵 
活性 。 

ValidationSummary 控件 向 用 户 提供 了 它 从 单个 有 效 性 验证 控件 的 ErrorMessage 属性 
中 检索 到 的 一 个 错误 列表 。 它 能 以 3 种 不 同 的 方式 显示 这 些 错误 ， 使 用 一 个 嵌 在 页 面 中 的 
列表 、 使 用 JavaScript 警报 框 或 者 同时 使 用 这 两 种 方式 。 可 以 通过 ShowMessageBox 和 
ShowSummary 属性 控制 这 个 设置 。 此 外 , DisplayMode 属性 可 以 修改 表现 错误 列表 的 方式 。 
默认 设置 为 BulletList， 其 中 每 个 错误 都 是 项 目 列表 中 的 一 个 项 。 


342 ”使 用 验证 控件 


验证 控件 的 使 用 非常 简单 ， 只 需 将 他 们 添加 到 页 面 ， 设 置 一 些 属性 即 可 。 

例 3-5: 使 用 验证 控件 。 

(1) 启动 VWD 2010, 打开 网 站 Chapter3， 通 过 “添加 新 项 ”对 话 框 在 该 网 站 中 添加 一 
个 名 为 Validator.aspx 的 Web 窗 体 页 。 

(2) 打开 Validator.aspx 的 “设计 ”视图 ， 选择“ 表 ”|“ 插 入 表 ” 命 令 打 开 “ 插 入 表格 ” 
对 话 框 ， 插 入 一 个 9 行 3 列 的 表格 ， 如 图 3-22 所 示 。 

G) 合并 第 一 行 的 3 个 单元 格 。 首 先 ， 选 中 这 3 个 单元 格 ， 然 后 选择 “ 表 ”|“ 修 改 ”| 
“合并 单元 格 ” 命 令 即 可 。 
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图 3-22 “插入 表格 ”对 话 框 


(4) 在 第 一 行 的 单元 格 中 输入 文本 “注册 表单 ”。 在 第 2~8 行 的 单元 格 中 ， 第 1 列 单 
元 格 中 输入 文本 信息 ， 在 第 2 列 单元 格 中 添加 用 于 输入 信息 的 TextBox 控件 ， 第 3 列 单元 
格 中 添加 相应 的 验证 控件 。 在 最 后 一 行 中 ， 第 1 列 添加 一 个 Button 控件 ， 用 于 提交 表单 数 
据 ， 第 2 列 添加 一 个 Label 控件 ， 用 于 显示 提示 信息 ， 第 3 列 添加 一 个 ValidationSummary 
控件 显示 验证 错误 信息 。 如 图 3-23 所 示 。 

(5) TextBox 控件 从 上 至 下 ,ID 依次 为 TextBoxl~TextBox7。 设 置 TextBox4 和 TextBox5 
的 TextMode 属性 为 Password。 
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(6) 同时 选中 5 个 RequireFieldValidator 控件 ， 设 置 其 Text 属性 为 “*”， 并 且 分 别 设 

置 它们 的 ErrorMessage 属性 为 “姓名 不 能 为 室 ”、 “年 龄 不 能 为 室 ”、 “Email 不 能 为 空 ”、 
“密码 不 能 为 室 ” 和 “确认 密码 不 能 为 室 ”。 设 置 每 个 RequireFieldValidator 控件 的 
ControlToValidator 属性 为 其 所 在 行 的 TextBox 控件 的 ID。 

(7) 设置 RangeValidation 控件 的 ControlToValidator 属性 为 TextBox2, Minimum Value 
属性 为 1, Maximum 属性 为 100, Type 属性 为 Integer, ErrorMessage 属性 为 “年 龄 是 1~100 
之 间 的 整数 ”。 

(8) 设置 RegularExpressionValidation 控件 的 ControlToValidator 属性 为 TextBox3， 
ErrorMessage 属性 为 “Email 格式 错误 ”; 然后 单 击 ValidationExpression 属性 右边 的 浏览 
按钮 ， 在 弹出 的 “正则 表达 式 编辑 器 ”对 话 框 中 选择 “Intemet 电子 邮件 地 址 ”选项 ， 如 图 
3-24 所 示 。 


注册 夫 单 
H * 
和 年龄， [ + 年 龄 是 1 100 之 间 的 整数 
Email, +Znail 格 式 错误 
密码 


密码 ， * 
确认 密码 ， * 两 次 输入 的 密码 不 一 致 ， 靖 重新 输入 
电话 ， 电话 和 手机 盏 少 要 输入 一 个 


四 Awt CEH.’ JAHA Wt CE. J A. Ww CC-, 
m ma mm 
| - Ce 
图 3-23 在 表格 中 添加 文本 信息 和 控件 图 3-24 “正则 表达 式 编辑 器 ”对 话 框 


(9) 设置 CompareValidation 控件 的 ControlToValidator 属性 为 TextBox5, ControlToCompare 
属性 为 TextBox4，ErrorMessage 属性 为 “两 次 输入 的 密码 不 一 致 ， 请 重新 输入 ”。 

(10) “电话 ” 行 对 应 的 验证 控件 是 CustomValidator 控件 ， 设 置 该 控件 的 Display 属性 
为 Dynamic，ErrorMessage 属性 为 “电话 和 手机 至 少 要 输入 一 个 ”， 然 后 为 该 控件 添加 
ServerValidate 事件 处 理 程 序 。 代 码 如 下 : 


protected void CustomValidatorl _ServerValidate(object source, ServerValidateEventArgs args) 


í 
if (!string.IsNullOrEmpty(TextBox6.Text) ||!string.IsNullOrEmpty(TextBox7.Text)) 
t 
args.IsValid = true; 
} 
else 
$ 
args.IsValid = false; 
} 
} 


(11) 设置 CustomValidator 控件 的 ClientValidationFunction 属性 为 ValidatePhone, 切换 
到 页 面 的 “ 源 ” 视 图 ， 在 <body> 之 前 添加 如 下 JavaScript 代码 : 
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<script type="text/javascript"> 
function ValidatePhone(source, args) { 
var telephone = document. getElementById('<%= TextBox6.ClientID %>'); 
var mobile = document. getElementById('<%= TextBox7.ClientID %>"); 
if (telephone.value != " || mobile.value != ") í 
args.IsValid = true; 


} 
else { 
args.IsValid = false; 
b 
} 
</script> 


上 述 JavaScript 函数 ValidatePhoneNumbers 是 客户 端 验证 函数 ， 确 保 在 将 页 面 提交 回 
服务 器 之 前 至 少 输入 了 一 个 电话 号 码 。 
(12) 设置 按钮 控件 的 Text 属性 为 “提交 ”，Label 控件 的 Text 属性 为 空 。 为 按钮 控件 
添加 单 击 事件 处 理 程序 ， 代 码 如 下 : 
protected void Button1_Click(object sender, EventArgs e) 
{ 
Labell .Text = "所 有 输入 信息 验证 通过 ! "; 
} 


(13) 编译 并 运行 程序 ， 在 浏览 器 中 加 载 页 面 Validator.aspx， 如 果 没 有 输入 任何 信息 ， 
或 者 输入 信息 不 合法 ， 将 给 出 错误 提示 ， 如 图 3-25 所 示 。 

(14) 回 到 VWD 中 ， 将 ValidationSummary 控件 的 ShowMessageBox 设置 为 True, 
ShowSummary 设置 为 False。 再 次 编译 并 运行 程序 ， 在 浏览 器 中 打开 页 面 ， 注 意 此 时 得 到 
的 不 是 含有 错误 的 内 联 列表 ， 而 是 一 个 警告 对 话 框 ， 如 图 3-26 所 示 。 


PT3 . lecdest E ~l 
zno mo sën eerw IAD #dw | 
Wema LR a- B- oe- mv- ro- "| 
注射 表单 = 
ta 
Fi 
Emal, 
Ein 
AUER. ` 
电话 ， 电话 和 手机 至 少 要 输入 一 个 
手机 ， 
WRT 

-HEFRAIT 

* FRERIT 
s= * Emal 不 能 为 空 

* 密码 不 能 为 空 

* 确认 秦 码 不 能 为 宁 

+ 电话 和 手机 至 少 要 输入 一 个 Ë 

CE PEKTE 

图 3-25 页 面 验证 效果 图 3-26 ”以 对 话 框 形式 显示 错误 


(15) 如 果 信 息 输入 全 部 正确 ， 则 全 部 验证 通过 ， 如 图 3-27 所 示 。 
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图 3-27 全 部 验证 通过 
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当 站 点 包含 的 页 面 比较 多 时 ， 有 一 个 稳固 而 清晰 的 导航 结构 就 很 重要 ， 这 样 才能 让 用 
户 顺 畅 地 浏览 站 点 。 使 用 良好 的 导航 系统 , 项 目 中 所 有 没有 连接 的 Web 页 面 就 会 形成 一 个 
完整 而 连贯 的 Web 站 点 。 

ASP.NET 4 提供 了 3 个 有 用 的 导航 控件 : SiteMapPath、TreeView 和 Menu。 

è SiteMapPath: 这 个 Web 控件 提供 一 个 面包 条 (breadcrumb)， 它 是 一 行文 本 ， 显 示 用 
户 当 前 在 网 站 结构 中 的 位 置 。 例 如 ， 在 网 上 书店 中 ， 用户 浏览 到 《Visual C++》 时 ， 
面包 条 可 能 类 似 于 “主页 -> 计算 机 -> 编程 类 ->Visual C++”， 其 中 每 部 分 (如 主页 ， 
计算 机 等 ) 都 显示 为 返回 到 前 一 部 分 的 链接 。 面 包 条 能 够 让 用 户 快速 地 查看 当前 在 
网 站 中 的 位 置 ， 并 沿 逻辑 层次 结构 向 上 导航 。 

e Menu: 这 个 Web 控件 提供 网 站 结构 的 层次 视图 。 对 于 学 校 的 网 站 ,顶层 菜单 将 包 
含 主 类 别 ( 如 学 校 介绍 、 机 构 设置 和 新 闻 等 ), 每 个 菜单 项 又 可 以 包含 各 自 的 子 菜单 ， 
显示 各 自 的 子 类 别 。 

© TreeView: 树 视 图 提供 了 与 菜单 相同 的 数据 ， 惟 一 的 区 别 是 显示 数据 的 方式 。 树 视 
图 显示 为 可 展开 或 可 折合 的 树 ， 而 菜单 (Menu) 是 由 菜单 项 和 子 菜单 组 成 。 

一 般 情况 下 ， 开 发 人 员 利 用 站 点 地 图 和 SiteMapPath 控件 实现 自动 导航 ， 利 用 Menu 

控件 或 者 TreeView 控件 实现 自 定义 导航 。 


3.5.1 创建 站 点 地 图 


为 了 更 容易 地 使 Menu, TreeView 或 SiteMapPath 显示 站 点 中 的 相关 页 面 ，ASP.NET 
使 用 一 个 基于 XML 的 文件 来 描述 Web 站 点 的 逻辑 结构 。 默 认 情 况 下 ， 这 个 文件 名 为 
Web.sitemap。 站 点 中 的 导航 控件 会 用 这 个 文件 以 有 组 织 的 方式 表现 相关 的 链接 。 只 要 将 一 
个 导航 控件 与 这 个 Web.sitemap 文件 挂钩， 就 能 创建 复杂 的 用 户 界面 元 素 ， 如 折 肝 菜单 或 
树 型 视图 等 。 
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注意 : 

默认 情况 下 , 应 将 站 点 地 图 文件 命名 为 Web.sitemap。 这 样 控件 就 可 以 自动 找到 正确 的 
文件 。 对 于 更 高 级 的 情况 ， 可 以 有 多 个 不 同名 称 的 站 点 地 图 文件 ， 且 在 向 系统 提供 这 些 附 
加 文件 的 web.config 中 有 一 个 配置 设置 。 在 大 多 数 情况 下 , 有 一 个 站 点 地 图 文件 就 足够 了 。 


站 点 地 图 文件 的 框架 结构 如 下 所 示 : 


<?xml version="1.0" encoding="utf-8" ?> 
<siteMap xmlns="http://schemas.microsoft.com/AspNet/SiteMap-File-1.0"> 
<siteMapNode url="~/" title=" 首 页 " description="Go to the homepage"> 
<siteMapNode url="~/Info.aspx" title=" 概 述 " description="Reviews published on this site" /> 
<siteMapNode url="~/About.aspx" title=" 关 于 " description="About this site" /> 
</siteMapNode> 
</siteMap> 


这 个 站 点 地 图 文件 的 根 节点 是 siteMap, 其 下 使 用 siteMapNode 节点 建立 层次 结构 , 每 
个 siteMapNode 可 以 有 多 个 子 节点 (但 是 ， 在 siteMap 元 素 下 只 能 有 一 个 siteMapNode), F 
节点 仍然 用 <siteMapNode> 定 义 。 可 以 用 来 创建 一 个 既 有 广度 又 有 深度 的 站 点 结构 。 在 本 
例 中 ， 只 有 一 个 名 为 “首页 ”的 根 节点 ， 它 包含 两 个 子 元 素 : “概述 ”和 “关于 ”。 本 例 
中 的 siteMapNode 元 素 有 3 个 特性 集 : url、title 和 description。 
o url 特性 应 指向 Web 站 点 中 的 有 效 页 面 。 可 以 用 ~ 语法 来 引用 基于 应 用 程序 根 文件 
夹 的 URL。 此 URL 在 网 站 地 图 中 必须 唯一 。 
o title 特性 用 于 显示 页 面 的 名 称 。 在 使 用 Menu, TreeView 和 SiteMapPath 控件 时 将 
看 到 关于 它 的 更 多 信息 。 
e description 特性 用 作 导 航 元 素 的 工具 提示 ， 可 有 可 无 。 


技巧 : 

虽然 ASP.NET 运行 库 不 允许 多 次 指定 同一 个 URL， 但 是 可 以 通过 添加 一 个 查询 字符 
串 使 URL 唯一 来 绕 过 这 一 问题 。 例如，~/Login.aspx 和 ~/Login.aspx?name=gemm 会 被 看 作 
两 个 不 同 的 页 面 。 


VWD 没有 自动 基于 当前 站 点 的 结构 创建 站 点 地 图 文件 的 方式 。 要 创建 一 个 有 用 的 
Web.sitemap 文件 ， 需 要 向 站 点 中 添加 一 个 文件 ， 然 后 手动 向 它 添加 必需 的 siteMapNode 
元 素 。 

例 3-6: 创建 站 点 地 图 文件 Web.sitemap 。 

(1) 启动 VWD 2010, 打开 网 站 Chapter3, 打开 “添加 新 项 ”对 话 框 , 选择 “站 点 地 图 ” 
选项 ， 添 加 默认 名 称 为 Web.sitemap 的 站 点 地 图 文件 。 

(2) 新 添加 的 Web.sitemap 文件 中 会 出 现 一 个 包含 两 个 子 节点 的 根 元 素 ， 修 改 
Web.sitemap 文件 使 它 包含 下 列 代码 : 


<?xml version="1.0" encoding="utf-8" ?> 
<siteMap xmlns="http://schemas microsoft.com/AspNet/SiteMap-File-1.0" > 
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<siteMapNode url="~/Default.aspx" title=" 首 页 ” description=" 首 页 "> 

<siteMapNode url="~/Hall.aspx" title=" 大 厅 " ”description=" 广 播 大 厅 " > 

</siteMapNode> 

<siteMapNode url="~/GuangChang.aspx" title=" 微 薄 广场 description=" 微 薄 广 场 "> 
<siteMapNode url="~/YuLe.aspx" title=" 娱 乐 空 间 " description=" 娱 乐 空间 " /> 
<siteMapNode url="~/XinLing.aspx" title=" ÙR KHL" description=" 心 灵 天 地 " /> 

</siteMapNode> 

</siteMapNode> 
</siteMap> 


(3) 保存 文件 ， 完 成 站 点 地 图 的 创建 。 
Web.sitemap 文件 本 身 用 处 并 不 大 。 需 要 向 站 点 中 添加 导航 控件 来 使 用 站 点 地 图 。 下 
面 将 介绍 如 何 使 用 导航 控件 来 实现 网 站 导航 。 


3.5.2 ”使 用 SiteMapPath 控件 


定义 好 站 点 地 图 之 后 ， 就 可 以 使 用 SiteMapPath 控件 显示 导航 路 径 了 ， 也 就 是 显示 当 
前 页 面 在 网 站 中 的 位 置 。 只 需 将 该 控件 拖 放 到 站 点 地 图 中 包含 的 .aspx 页 面 上 , 它 就 会 自动 
实现 导航 ， 不 需要 开发 者 编写 任何 代码 。 

为 了 能 够 使 用 Web.sitemap 文件 ，ASP.NET 使 用 了 SiteMapDataSource 控件 ， 这 是 一 
个 数据 控件 。 当 使 用 SiteMapPath 控件 显示 “痕迹 导航 ”时 ,ASP.NET 会 自动 找到 Web.sitemap 
文件 。 使 用 另外 两 个 导航 控件 时 ， 则 需要 显 式 地 指定 一 个 SiteMapDataSource 作为 
Web.sitemap 文件 的 中 间 层 。 

添加 站 点 地 图 到 应 用 程序 中 时 ， 需 要 将 站 点 地 图 放 在 Web 应 用 程序 的 根 目录 下 ， 并 保 
持 其 文件 为 Web.sitemap 。 如 果 将 该 文件 放 在 另 一 个 文件 夹 中 或 选择 不 同 的 文件 名 ， 
SiteMapPath 导航 控件 将 不 能 找到 站 点 地 图 ， 就 不 能 知道 网 站 的 结构 ， 因 为 默认 情况 下 
SiteMapPath 导航 控件 在 根 目 录 下 寻找 名 为 Web.sitemap 的 文件 。 

SiteMapPath 控件 显示 了 当前 在 站 点 结构 中 的 位 置 。 它 将 自身 表现 为 一 系列 链接 ， 常 称 
之 为 痕迹 导航 (breadcrumb)。 它 是 一 个 非常 简单 但 功能 强大 的 控件 ， 有 50 多 个 公有 属性 ， 
可 以 通过 “属性 ”面板 来 设置 这 些 属性 。 

像 大 多 数 Web 控件 一 样 ，SiteMapPath 控件 也 有 很 多 可 用 于 定制 其 外 观 的 属性 。 如 表 
3-8 所 示 为 SiteMapPath 控件 的 常用 属性 。 


表 3-8 SiteMapPath 控件 的 常用 属性 


属 性 t PA 
CurrentNodeStyle 定义 当前 节点 的 样式 ， 包 括 字 体 、 颜 色 和 样式 等 
NodeStyle 定义 导航 路 径 上 所 有 节点 的 样式 
re 指定 在 导航 路 径 上 显示 的 相对 于 当前 节点 的 父 节点 层 数 。 默 认 值 为 -1， 表 


示 父 级 别 数 没有 限制 
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( 续 表 ) 
属 性 说 有明 

指定 导航 路 径 上 各 节点 的 显示 顺序 。 默认 值 为 RootToCurrent, 即 按 从 左 到 
PathDirection 右 的 顺序 显示 从 根 节点 到 当前 节点 的 路 径 。 另 一 选项 为 CurrentToRoot， 即 

按 相反 的 顺序 显示 导航 路 径 
PathSeparator 指定 导航 路 径 中 节点 之 间 分 隔 符 。 默 认 值 为 >， 也 可 自 定 义 为 其 他 符号 
PathSeparatorStyle 定义 分 隔 符 的 样式 
RenderCurrentNodeAsLink | 是 否 将 导航 路 径 上 当前 页 名 称 显示 为 超 链接 。 默 认 值 为 false 
RootNodeStyle 定义 根 节点 的 样式 


当 鼠 标 悬 停 于 导航 路 径 的 某 个 节点 时 ， 是 否 显示 相应 的 工具 提示 信息 。 默 
认 值 为 tue， 即 当 鼠 标 悬 停 于 某 节点 上 时 ， 显 示 该 节点 在 站 点 地 图 中 定义 
的 Description 属性 值 


ShowToolTips 


例 3-7: 使 用 SiteMapPath 控件 和 例 3-6 中 的 站 点 地 图 文件 实现 自动 导航 。 

(1) 启动 VWD 2010， 打 开 网 站 Chapter 3， 通 过 “添加 新 项 ”对 话 框 ， 分 别 添加 名 为 
Hall.aspx、GuangChang.aspx、YuLe.aspx 和 XinLing.aspx 的 网 页 。 

(2) 在 每 个 页 面 中 都 添加 一 个 SiteMapPath 控件 ， 在 “设计 ”视图 中 可 以 看 到 该 页 面 的 
导航 路 径 ， 如 图 3-28 所 示 为 XinLing.aspx 的 “设计 ”视图 效果 。 可 见 ， 利 用 站 点 地 图 和 
SiteMapPath 控件 实现 自动 导航 非常 方便 。 


Lbody | 
首页 > BNR > LAAIE 
| 
图 3-28 添加 SiteMapPath 控件 后 的 效果 
(3) 本 例 无 须 编写 任何 代码 ， 编 译 并 运行 程序 ， 在 浏览 器 中 打开 不 同 的 页 面 ， 用 户 体 


如 果 要 在 客户 端 查 看 源 文件 , 可 以 看 到 ,SiteMapPath 呈现 为 一 系列 包含 一 个 链接 或 纯 
文本 的 <span> 元 素 。 


3.5.3 ”使 用 Menu 控件 


Menu 控件 主要 用 于 创建 一 个 菜单 ， 让 用 户 快速 选择 不 同 页 面 ， 从 而 完成 导航 功能 。 
该 控件 可 以 包含 一 个 主 菜单 和 多 个 子 菜 单 。 菜 单 有 静态 和 动态 两 种 显示 模式 。 静 态 显 示 模 
式 是 指定 义 的 菜单 始终 完全 显示 ， 动 态 显示 模式 是 指 需要 用 户 将 鼠标 停留 在 菜单 项 上 时 才 
显示 子 菜单 。 

Menu 控件 的 常用 属性 如 表 3-9 所 示 。 
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表 3-9 Menu 控件 的 常用 属性 
E É 说 明 
DynamicEnableDefaultPopOutImage 


是 否 在 菜单 各 项 之 间 显示 分 隔 图 像 。 默 认 值 为 true 
StaticEnableDefaultPopOutImage 


DynamicPopOutImasgeUrl : E " 
j 设置 菜单 中 自 定 义 分 隔 图 像 的 URL 
StaticPopOutImageUrl 
DynamicBottomSeparatorImage Url 指定 在 菜单 项 下 方 显示 图 像 的 URL。 默 认 值 为 空 字符 串 ("")， 
StaticBottomSeparatorImaseUrl 即 菜单 项 下 方 不 显示 任何 图 像 
DynamicTopSeparatorImageUrl 指定 在 菜单 项 上 方 显示 图 像 的 URL。 默 认 值 为 空 字符 串 ("")， 
StaticTopSeparatorImageUrl 即 菜单 项 上 方 不 显示 任何 图 像 
DynamicHorizontalOffset 指定 菜单 相对 于 其 父 菜单 的 水 平 距离 ， 单 位 是 像素 ， 默 认 值 为 
StaticHorizontalOffset 0。 该 属性 值 可 正 可 负 ， 为 负 值 时 ， 各 菜单 之 间 的 距离 会 缩小 
DynamicVerticalOffset WEN ¿suk 
指定 菜单 相对 于 其 父 菜单 项 的 垂直 距离 
StaticVerticalOffset 
MaximumDynamicDisplayLevels 设置 动态 菜单 的 最 大 层 数 。 默 认 值 为 3 
设置 菜单 的 展开 方向 。 有 Horizontal 和 Vertical 两 个 选项 ， 默 
Orientation 
认 值 为 Vertical， 即 垂直 方向 
i 获取 包含 Menu 控件 中 的 所 有 菜单 项 ,返回 MenuItemCollection 
ti 
ems Ie 
SiteMapDataSource 控件 的 ID, X Menu 控件 提供 数据 创建 动 
DataSourceID 
ASP.NET 4.0 中 新 增 的 属性 。 这 个 属性 用 于 确定 控件 是 使 用 表 
RenderingMode TOEA PoPa 
和 内 联 样式 ， 还 是 使 用 无 序列 表 和 CSS 样式 来 显示 自身 
ASP.NET 4.0 中 新 增 的 属性 。 这 个 属性 使 得 开发 人 员 可 以 完全 
IncludeStyleBlock 


控制 控件 的 样式 


Menu 控件 的 用 法 非常 灵活 ， 设 计 者 可 以 利用 它 定 义 各 种 菜单 样式 ， 实 现 类 似 于 
Windows 窗口 菜单 的 功能 。 

例 3-8: 使 用 Menu 控件 在 网 页 中 添加 一 个 菜单 ， 实 现 自 定义 导航 功能 。 

(1) 启动 YWD 2010， 打 开 网 站 Chapter 3， 通 过 “添加 新 项 ”对 话 框 ， 分 别 添加 名 为 
Menu.aspx, One.aspx, One.aspx, Twol.aspx, Two2.aspx, Threel.aspx 和 Three2.aspx 的 网 页 。 

(2) 打开 Menu.aspx 文件 的 “设计 ”视图 ， 添 加 一 个 Menu 控件 。 

(3) 将 Menu 控件 的 Orientation 属性 设置 为 Horizontal， 以 便 使 其 横向 排列 。 

(4) 单 击 Menu 控件 右上 方 的 小 三 角 ， 打 开 “Menu 任务 ”面板 ， 选 择 “ 编 辑 菜单 项 ” 
命令 ， 如 图 3-29 所 示 。 之 后 将 打开 “菜单 项 编辑 器 ”对 话 框 ， 如 图 3-30 所 示 。 在 此 可 输 
入 各 级 菜单 项 。 
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图 3-29 


“Menu 任务 ”面板 图 3-30 “菜单 项 编辑 器 ”对 话 框 


(5) “菜单 项 编辑 器 ”对 话 框 中 的 工具 栏 按钮 的 功能 介绍 如 图 3-31 所 示 。 


(6) 在 “EN 


在 同 级 间 将 项 下 移 
图 3-31 工具 栏 按钮 的 功能 介绍 


项 编辑 器 ”窗口 右 侧 的 属性 选项 中 ， 利 用 NavigateUrl 属性 可 以 设置 各 菜 


单项 链接 的 网 页 


， 单 击 该 属性 右 侧 的 浏览 按钮 打开“ 选择 URL” 对 话 框 ， 可 选择 当前 网 


站 内 的 页 面 ， 全 部 设置 完成 后 ， 单 击 “ 确 定 ” 按 钮 ， 关 闭 “ 菜 单项 编辑 器 ”对 话 框 。 

(7) 为 了 使 导航 菜单 更 美观 ， 可 以 给 Menu 控件 应 用 一 下 格式 ， 打 开 “Menu 任务 ” 面 
板 ， 选 择 “ 自 动 套用 格式 ”命令 ， 然 后 打开 “自动 套用 格式 ”对 话 框 ， 选 择 “ 传 统 型 ” 架 
构 ， 单 击 “ 确 定 ” 按 钮 ， 如 图 3-32 所 示 。 

至 此 ， 完 成 Menu 控件 的 设置 ,切换 到 Menu.aspx 的 “ 源 ” 视 图 , 可 以 看 到 生成 的 代码 。 

(8) 编译 并 运行 程序 ， 在 默认 浏览 器 中 打开 Menu.aspx 网 页 ， 效 果 如 图 3-33 所 示 。 


文件 @ SEO FEV wQ IAD MW 


k RER | Æ http://localhost: 11... E A- >| 


Oom 


CD ( wa )( sme ) @ ru Z sim -| 


图 3-32 


“自动 套用 格式 ”对 话 框 图 3-33 Menu 控件 实现 的 导航 效果 
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3.5.4 使 用 TreeView 控件 


TreeView 控件 与 Menu 控件 相似 ， 都 提供 了 导航 功能 。TreeView 控件 与 Menu 控件 的 
区 别 在 于 ， 它 不 像 Menu 控件 那样 由 菜单 项 和 子 菜单 组 成 ， 而 是 用 一 个 可 折 释 的 树 显示 网 
站 的 各 个 部 分 。 根 节点 下 可 以 包含 多 个 子 节点 ， 子 节点 下 又 可 以 包含 子 节点 ， 最 下 层 是 叶 
子 节点 。 访 问 者 可 以 快速 看 到 网 站 的 所 有 部 分 及 位 于 网 站 结构 层次 中 的 位 置 。 树 中 的 每 个 


节点 都 显示 为 一 个 超 链 接 。 


TreeView 控件 也 包含 很 多 属性 ， 其 中 常用 属性 如 表 3-10 所 示 。 


B 性 


表 3-10 TreeView 控件 的 常用 属性 
说 RA 


CollapseImageUrl 


CollapseImageToolTi 


ExpandImageUrl 


EnableClientScript 


节点 折合 后 显示 的 图 像 。 默 认 情况 下 ， 常 用 带 方 框 的 + 号 作为 可 展开 指示 
图 像 

当 用 户 将 鼠标 基 停 在 可 折合 菜单 项 上 时 显示 的 工具 提示 
节点 展开 后 显示 的 图 像 。 默 认 情 况 下 ， 常 用 带 方 框 的 -号 作为 可 折合 指示 
图 像 

是 否 可 以 在 客户 端 处 理 节点 的 展开 和 折 营 事件 。 默 认 值 为 true 


ExpandDepth 


ExpandImageToolTi 


第 一 次 显示 TreeView 控件 时 , 树 的 展开 层次 数 。 默 认 值 为 FullyExpand( 即 
一 1)， 表 示 全 部 展开 所 有 节点 
当 用 户 将 鼠标 悬 停 在 可 展开 菜单 项 上 时 显示 的 工具 提示 


Nodes 


设置 TreeView 控件 的 各 级 节点 及 其 属性 


ShowExpandCollapse 是 否 显示 折合 、 展 开 图 像 。 默 认 值 为 true 
ShowLines 是 否 显示 连接 子 节点 和 父 节 点 之 间 的 连 线 。 默 认 值 为 false 


指示 在 哪些 类 型 节点 的 文本 前 显示 复 选 框 。 共 有 5 个 属性 值 : None( 所 有 


ShowCheckBoxes 节点 均 不 显示 )、Root( 仅 在 根 节点 前 显示 )、Parent( 仅 在 父 节点 前 显示 )、 
Leaf 仅 在 叶 节 点 前 显示 ) 和 All( 所 有 节点 前 均 显示 )。 默 认 值 为 None 

HoverNodeStyle 当 鼠 标 悬 停 于 节点 上 时 ， 显 示 节 点 的 样式 

LeafNodeStyle 叶 节 点 的 样式 

LevelStyle 特殊 深度 节点 的 样式 

NodeStyle 所 有 节点 的 默认 样式 

ParentNodeStyle 父 节 点 的 样式 

RootNodeStyle 根 节点 的 样式 

SelectedNodeStyle 选 定 节点 的 样式 


例 3-9: 利用 TreeView 控件 实现 网 站 导航 功能 。 
(1) 启动 VWD 2010， 打 开 网 站 Chapter3 ， 通 过 “添加 新 项 ”对 话 框 ， 添 加 名 为 


TreeView.aspx 的 网 页 。 


(2) 打开 TreeView.aspx 文件 的 “设计 ”视图 , 添加 1 个 TreeView 控件 , 单 击 TreeView 
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控件 右上 方 的 小 三 角 , 打开 “TreeView 任务 ”面板 ， 在 “选择 数据 源 ” 下 拉 列 表 中 选择 “< 


新 建 数据 源 >” 选 项 ， 如 图 3-34 所 示 。 
(3) 在 将 打开 “数据 源 配置 向 导 ” 对 话 框 中 选择 “站 点 地 图 ”选项 ， 如 图 3-35 所 示 。 


T 选择 玫 据 源 类 型 


应 用 程序 从 哪里 获取 数据 T)? 


| m 文件 BD 


的 


| asp:treeview#TreeView1 | 


aj 人 TreeView 任务 为 数据 源 指 定 mO: 
日 父 级 1 | | SSERSL Si tellapDat Source! 
叶 1 | | 选择 数据 源 : G ] 
SAn =l 
a RE 2 | Dart 
i 
H2 (a A w J 
L 
图 3-34 “TreeView 任务 ”面板 图 3-35 “数据 源 配置 向 导 ” 对 话 框 


(4) 单 击 “确定 ”按钮 后 ，SiteMapDataSource 控件 将 从 Web.sitemap 文件 中 得 到 站 点 


信息 ， 此 时 的 TreeView 控件 如 图 3-36 所 示 。 
(5) 编译 并 运行 程序 ， 在 浏览 器 中 加 载 TreeView.aspx 页 面 ， 效 果 如 图 3-37 所 示 。 


go- [E] suu //1oeslhost lli? res x 
XPO KEO FEV KERA IAV A” 
ARER Æ http://locslhost:11... | ` 
asptreeview#Treeyiew1 — — : 
| Treeyiew 任务 日 首页 息 
[BEES | 大 厅 
中 | 选择 数据 源 : [SitellapDataSourcel (mi 已 微薄 广场 
刷新 架构 | 娱乐 空间 
编辑 TreeNode BERBE | 心灵 天 地 A 
SitelapDataSource ° 1 ] 显示 行 | ga =a 一 
图 3-36 ”设置 数据 源 后 的 TreeView 控件 图 3-37 TreeView 导航 示例 


介绍 完 导航 控件 之 后 ， 下 面 给 出 关于 网 站 导航 的 一 些 实用 提示 ， 如 下 所 示 。 

当 开 始 构 建 一 个 知道 将 来 会 增长 的 Web 站 点 时 ， 创 建 一 个 逻辑 结构 。 不 要 把 所 有 
文件 都 放 在 Web 站 点 的 根 文件 夹 中 ， 而 要 将 相关 的 文件 根据 逻辑 组 合 到 同一 个 文 
件 夹 中 。 这 样 的 逻辑 组 合 可 以 使 站 点 容易 管理 , 用 户 容易 找到 他 们 要 找 的 页 面 。 虽 
然 用 Web.sitemap 文件 很 容易 将 页 面 移 到 Menu 或 TreeView 中 , 但 是 如 果 同 时 使 用 
了 编程 方式 的 重 定向 或 转换 时 就 较 难 了 , 因为 还 需要 更 新 服务 器 端 代码 以 反映 新 的 
站 点 结构 。 为 了 创建 稳固 的 页 面 结构 ， 可 以 在 开始 构建 站 点 之 前 把 它 画 在 纸 上 ， 或 
者 使 用 站 点 地 图 图 表 工 具 ， 如 Microsoft Visio 。 
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e° 尽量 限制 显示 在 Menu 或 TreeView 控件 中 的 主 项 和 子 项 的 数目 。 如 果 供 用 户 选 择 
的 选项 列表 过 长 ， 用 户 会 迷路 或 者 混淆 。 
e 当 创 建 用 来 存储 页 面 的 文件 夹 时 ， 给 它们 起 简短 且 有 他 辑 的 名 称 。 


3.6 ”用 户 控件 


有 时 可 能 需要 控件 具有 ASP.NET 内 置 服务 器 控件 没有 的 功能 。 在 这 种 情况 下 ， 用 户 
可 以 创建 自己 的 控件 。 有 两 个 选择 ， 可 以 创建 用 户 控 件 和 自 定义 控件 。 

用 户 控件 是 能 够 在 其 中 放置 标记 和 服务 器 控件 的 容器 。 然 后 ， 可 以 将 用 户 控件 作为 一 
个 单元 对 待 ， 为 其 定义 属性 和 方法 。 

自 定义 控件 是 编写 的 一 个 类 ， 此 类 从 Control 或 WebControl 派生 。 

创建 用 户 控 件 要 比 创建 自 定义 控件 方便 很 多 ， 因 为 可 以 重用 现 有 的 控件 。 用 户 控件 使 
创建 具有 复杂 用 户 界面 元 素 的 控件 极为 方便 。 


3.6.1 用 户 控 件 简介 


用 户 控件 可 以 用 来 将 逻辑 上 相关 的 内 容 和 控件 组 合 在 一 起 ， 然 后 作为 一 个 单位 在 内 容 
页 、 母 版 页 和 其 他 用 户 控件 内 使 用 。 

TE ASP.NET 2.0 之 前 的 版 本 中 ， 用 户 控件 常常 用 来 创建 必须 出 现在 站 点 中 每 个 页 面 上 
的 可 重用 的 功能 块 。 例 如 ， 要 创建 一 个 菜单 ， 就 会 创建 一 个 用 户 控 件 ， 然 后 将 那个 控件 添 
加 到 站 点 中 的 每 个 页 面 。 由 于 ASP.NET 对 母 版 页 的 支持 ， 因 此 这 些 情况 下 不 再 需要 用 户 
控件 ,这样 可 以 使 对 站 点 结构 的 修改 更 容易 。 尽 管 母 版 页 带 来 了 一 些 优点 , 然而 在 ASP.NET 
Web 站 点 中 仍然 有 利用 用 户 控 件 的 空间 。 

在 某 种 程度 上 ， 用 户 控 件 看 起 来 有 一 些 像 服务 器 控件 ， 它 们 都 可 以 包含 能 够 在 页 面 中 
重用 的 编程 旭 辑 和 表现 。 

从 开发 设计 角度 来 看 ， 用 户 控件 与 完整 的 ASP.NET 网 页 (.aspx 文件 ) 非 常 相似 ， 同 时 
具有 用 户 界面 页 和 代码 页 。 可 以 采取 与 创建 ASP.NET 页 相似 的 方式 创建 用 户 控件 ， 然 后 
向 其 中 添加 所 需 的 标记 和 子 控件 .用 户 控件 可 以 像 页 面 一 样 包含 对 其 内 容 进行 操作 的 代码 。 

但 是 ， 用 户 控件 与 ASPNET 网 页 也 有 以 下 一 些 区 别 。 

e 用 户 控件 的 文件 扩展 名 为 .ascx。 

e° 用 户 控 件 中 没有 @Page 指令 ， 而 是 包含 @Control 指令 ， 该 指令 对 配置 及 其 他 属性 
进行 定义 。 

o 用 户 控 件 不 能 作为 独立 文件 运行 。 而 必须 像 处 理 任何 控件 一 样 ， 将 它们 添加 到 
ASPNET 页 面 中 。 
HIERA HTML, body 或 form 元 素 。 这 些 元 素 必须 位 于 宿主 页 中 。 


° 
m 
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e 可 以 在 用 户 控件 上 使 用 与 在 ASP.NET 网 页 上 所 用 相同 的 HTML 元 素 (HTML、body 
或 form 元 素 除外 ) 和 Web 控件 。 例 如 ， 如 果 要 创建 一 个 将 用 作 工 具 栏 的 用 户 控件 ， 
则 可 以 将 一 系列 Button 服务 器 控件 放 在 该 控件 上 ， 并 创建 这 些 按钮 的 事件 处 理 程序 。 


3.6.2 ”创建 用 户 控件 


在 站 点 中 添加 用 户 控件 的 方法 与 添加 其 他 类 型 的 内 容 相 似 ， 只 须 在 “添加 新 项 ”对 话 
框 中 选择 “Web 用 户 控件 ”选项 即 可 。 

一 且 向 站 点 中 添加 了 一 个 用 户 控件 ， 它 就 会 自动 在 文档 窗口 中 打开 。 用 户 控件 没有 @ 
Page 指令 ， 而 是 有 一 个 @ Control 指令 ， 如 下 所 示 : 


<%@ Control Language="C#" AutoEventWireup="true" CodeFile="WebUserControl.ascx.cs" 
Inherits="WebUserControl" %> 


接 下 来 ， 就 可 以 使 用 在 前 面 创建 页 面 时 用 到 的 所 有 工具 来 设计 用 户 控件 。 

例 3-10: 创建 一 个 实现 微调 控件 的 用 户 控件 。 

(1) 启动 VWD 2010， 打 开 网 站 Chapter3 ， 通 过 “添加 新 项 ”对 话 框 ， 添 加 名 为 
WebUserControl.ascx 的 用 户 控件 。 

(2) 切换 到 WebUserControl.ascx 的 “设计 ”视图 , 添加 一 个 TextBox 控件 和 两 个 Button 
控件 到 设计 窗口 中 。 两 个 Button 控件 的 Text 属性 分 别 设置 为 “<” 和 “>”，TextBox 控 
件 的 Text 属性 设置 为 0， 控 件 布局 如 图 3-38 所 示 。 

(3) 切换 到 WebUserControll 的 代码 视图 ， 即 打开 WebUserControl.ascx.cs 文件 ， 定 义 
变量 ， 为 Page Load 事件 、 两 个 按钮 的 单 击 事件 添加 如 下 代码 : 


protected int number: 
protected void Page Load(object sender, EventArgs e) 
{ 
if (IsPostBack) 
{ 
number = int.Parse(TextBox1.Text); 
} 
else 
{ 
number = 0; 
} 
} 
protected void Button2_Click(object sender, EventArgs e) 
{ 
number++; 
TextBox1.Text = number.ToString(): 
} 


protected void Button1_Click(object sender, EventArgs e) 
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number--; 
TextBox1.Text = number.ToString(); 
} 


(4) 保存 用 户 控 件 ， 至 此 完成 用 户 控件 的 创建 ， 但 还 不 能 在 浏览 器 中 查看 效果 ， 必 须 
将 该 用 户 控 件 添加 到 ASPNET 页 面 中 才 行 。 


a 


E m E 


Bkt | 口 拆 分 | 回 源 


图 3-38 控件 布局 


3.6.3 ”使 用 用 户 控件 


要 在 ASP.NET 页 面 或 另 一 个 用 户 控件 中 使 用 一 个 用 户 控件 ， 需 要 执行 如 下 两 个 步骤 。 
(1) 注册 控件 ， 方 法 是 向 希望 出 现 用 户 控件 的 页 面 或 控件 中 添加 一 个 @ Register 指令 。 
(2) 向 页 面 添加 用 户 控件 的 标记 ， 并 可 以 (可 选 地 ) 在 其 上 设置 一 些 特性 。 

@ Register 指令 包含 如 下 3 个 重要 的 特性 。 

o src: 指向 要 使 用 的 用 户 控件 。 为 了 在 以 后 的 阶段 使 页 面 的 移动 更 容易 ， 也 可 以 用 ~ 
语法 指向 应 用 程序 根 文 件 夹 中 的 控件 。 

e tagname: 用 在 页 面 的 控件 声明 中 的 标记 名 。 可 以 自由 地 命名 这 个 名 称 ， 但 通常 都 
让 它 与 控件 的 名 称 相 同 。 

o tagprefix: 容纳 用 在 页 面 的 控件 声明 中 的 TagName 的 前 级 。 正 如 ASP.NET 用 asp 
前 绥 指 代 它 的 控件 一 样 ， 也 需要 为 自己 的 用 户 控 件 提供 一 个 前 组 。 默 认 情况 下 ， 这 
个 前 级 是 uc， 后 跟 一 个 序号 ， 不 过 也 可 以 将 它 改 为 其 他 内 容 ， 如 改 为 公司 名 称 或 
者 自 定义 的 缩 略 词 。 

例 3-11: 使 用 例 3-10 中 创建 的 用 户 控件 。 

(1) 启动 VWD 2010， 打 开 网 站 Chapter3 ， 通 过 “添加 新 项 ”对 话 框 ， 添 加 名 为 

UserControlTest.ascx 的 用 户 控件 。 
(2) 切换 到 UserControlTest.aspx 的 “设计 ”视图 ， 从 “解决 方案 资源 管理 器 ”中 拖 动 
WebUserControl.ascx 到 页 面 中 。 

(3) 切换 到 “ 源 ” 视 图 , 可 以 看 到 在 @Page 指令 下 方 自动 生成 的 @Register 指令 , 如下: 
<%@ Register src="WebUserControl.ascx" tagname="WebUserControl" tagprefix="uc1" %> 

<div> 中 生成 的 声明 控件 的 代码 如 下 : 

<div> 
<ucl:WebUserControl ID="WebUserControll" runat="server" /> 
</div> 
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(4) 编译 并 运行 程序 ， 在 默认 浏览 器 中 打开 UserControlTest.aspx 页 面 ， 单 击 微调 按钮 
即 可 改变 文本 框 中 的 数值 ， 如 图 3-39 所 示 。 


ttp: //localhost:1117/Chapter3/UserContr... m 口 因 


EIE E) http: //localhost:1117/Chapter3/UskrContrelTest. aspx v| 
XED SED FEV REAW IAW Wq 
ABER |Æ http://locslhost:11... -8-0 ” 


zaja [zJ 


@ Internet far Rios ~ 


图 3-39 ”使 用 用 户 控件 页 面 效果 


3.64 为 用 户 控件 添加 属性 


虽然 使 用 控件 创建 重复 性 的 内 容 已 经 非常 有 用 了 ， 但 如 果 向 它们 添加 自 定义 逻辑 ， 它 
们 就 会 更 加 有 用 。 通 过 向 用 户 控 件 添 加 公有 属性 或 方法 ， 可 以 影响 控件 运行 时 的 行为 。 当 
向 用 户 控件 添加 一 个 属性 后 , 它 会 自动 在 正在 使 用 的 页 面 中 的 控件 的 “智能 提示 ”中 和 “ 属 
性 ”面板 中 变 得 可 用 ， 使 得 改变 外 部 文件 (如 页 面 ) 中 的 行为 变 得 更 容易 。 

为 了 向 用 户 控件 中 添加 属性 和 方法 ， 可 以 将 它们 添加 到 控件 的 后 台 代 码 文 件 中 。 添 加 
的 属性 可 以 是 各 种 形式 的 属性 ， 就 像 设置 标准 控件 的 属性 那样 。 

为 了 使 微调 控件 更 完善 ， 可 以 为 控件 添加 两 个 属性 : Min 和 Max， 分 别 表示 控件 所 人 允 
许 的 最 大 和 最 小 值 。 

例 3-12: 为 控件 添加 属性 Min 和 Max。 

(1) 启动 VWD 2010， 打 开 网 站 Chapter3， 打 开 用 户 控件 WebUserControl.ascx 的 后 台 
代码 文件 ， 并 添加 属性 。 

为 了 帮助 创建 这 个 属性 ，VWD 提供 了 一 个 简便 的 代码 段 。 要 在 C# 中 激活 该 代码 段 ， 
输入 prop 后 按 Tab 键 两 次 。VWD 会 添加 自动 属性 的 代码 结构 。 但 是 ， 这 样 做 会 创建 一 个 
完整 的 属性 而 不 是 创建 一 个 自动 属性 ， 因 此 在 这 种 情况 下 ， 最 好 手动 输入 代码 。 输 入 代码 
之 后 ， 可 以 再 次 按 下 Tab 键 在 字段 之 间 和 移动， 分别 输入 正确 的 数据 类 型 和 属性 名 。 代 码 
如 下 : 


public int Min í get; set; } 
public int Max í get; set; } 


(2) 修改 两 个 按钮 控件 的 单 击 事件 处 理 程序 ， 当 number 值 达 到 Min 或 Max 时 将 不 能 
继续 减 小 或 增 大 ， 代 码 如 下 : 


protected void Button2_Click(object sender, EventArgs e) 
Í 
number++; 
if (number > Max) 
number = Max; 
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TextBox1.Text = number.ToString(); 
if (number — Max) 

Button2 Enabled = false; 
Button1 Enabled = true; 


} 
protected void Button1_Click(object sender, EventArgs e) 
d 
number--; 
if (number < Min) 
number = Min; 
TextBox1.Text = number.ToString(); 
if (number = Min) 
Button1 Enabled = false; 
Button2. Enabled = true; 
) 


(3) 打开 UserControlTest.aspx 页 面 ， 选 中 用 户 控件 ， 可 以 在 “属性 ”面板 中 设置 新 添 
加 的 属性 Min 和 Max， 如 图 3-40 所 示 。 

(4) 如 果 在 “ 源 ” 视 图 中 直接 输入 代码 ， 也 可 以 从 智能 提示 窗口 中 看 到 这 两 个 属性 ， 
如 图 3-41 所 示 。 


FebUserControll (UC1 WEBUSERCO + 


a) WebUserControll 
ClientIDlode Inherit 
EnableThening True 
EnableVienStat True 


runat="server" Min="0" |/> 
9 ClientIDode | 
8 EnableThening | 


Nex 2 O EnableyievState | 
Min o * m | 
runat server 
ViewStatellode Inherit 9 Min 
Visible True # bortTransaction 
F OnConmitTransaction 
am) F OnDataBinding x) 
图 3-40 “属性 ”面板 图 3-41 智能 提示 窗口 


(5) 设置 了 Min 和 Max 属性 后 ， 当 文本 框 中 的 值 达 到 最 大 值 时 ， 将 不 能 再 增 大 。 当 达 
到 最 小 值 时 ， 将 不 能 再 减 小 。 


365 ”用 户 控件 的 站 点 范围 注册 


如 果 用 户 控件 要 在 多 个 页 面 中 使 用 , 则 可 以 在 web.config 文件 中 全 局 地 注册 这 个 控件 。 
这 样 ， 它 就 会 变 得 在 整个 站 点 内 可 用 ， 而 不 需要 在 每 个 页 面 上 注册 。 

例 3-13: 在 web.config 文件 中 注册 用 户 控 件 。 

(1) 打开 站 点 根 文件 夹 中 的 web.config 文件 。 

(2) 在 <system.web> 元 素 内 添加 如 下 代码 ， 其 中 包含 一 个 带 有 <add 信子 元 素 的 <controls /> 
元 素 : 
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<pages theme="Monochrome"> 
<controls> 
<add tagPrefix="uc1" tagName="WebUserControl" src="~/WebUserControl.ascx" /> 
</controls> 
</pages> 


(3) 保存 修改 并 关闭 文件 。 

(4) 此 时 ， 在 ASP.NET 网 页 中 添加 用 户 控件 时 ， 就 不 需要 @Register 指令 了 。 

提示 : 

用 户 控件 对 于 封装 重复 内 容 非 常 有 效 ， 但 是 它们 也 会 使 站 点 难以 管理 ， 因 为 代码 和 逻 
辑 包 含 在 多 个 文件 中 。 所 以 ， 不 要 过 度 使 用 用 户 控件 。 如 果 不 确定 有 些 内容 是 否 会 在 站 点 
的 另 一 部 分 中 重用 ， 可 以 先 直 接 把 它 诅 在 页 面 中 。 如 果 有 需要 ， 再 将 它 移 到 单独 的 用 户 控 
Tos, 
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本 章 介 绍 了 ASP.NET 服务 器 控件 以 及 用 户 控 件 。 使 用 ASP.NET 服务 器 控件 ， 可 以 大 
幅 减少 开发 Web 应 用 程序 所 需 编写 的 代码 量 ， 提 高 开发 效率 和 Web 应 用 程序 的 性 能 。 本 
章 重 点 介绍 了 标准 控件 、HTML 控件 、 验 证 控件 和 导航 控件 ， 其 他 类 别 的 控件 将 在 其 他 章 
节 介 绍 或 不 作为 本 书 所 学 内 容 。 

在 已 有 控件 的 基础 上 ， 还 可 以 开发 更 实用 的 用 户 控件 ， 用 户 控件 能 够 大 大 提高 站 点 的 
可 维护 性 。 不 需要 在 站 点 中 的 很 多 不 同 页 面 上 重复 相同 的 标记 和 代码 ， 可 以 将 代码 封装 到 
单个 控件 中 ， 然 后 在 站 点 的 不 同 区域 使 用 该 控件 。 
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1. TextBox 控件 的 TextMode 属性 有 哪 几 个 可 选 值 ， 各 是 什么 含义 。 

2. 如 何 将 RadioButton 控件 进行 分 组 ? 

3. ASP.NET 提供 了 几 个 验证 控件 ， 各 有 什么 作用 ? 

4. 当 使 用 一 个 CustomValidator 控件 时 ， 可 以 在 客户 端 和 服务 器 上 编写 有 效 性 验证 代 
码 。 如 何 告知 ASP.NET 运行 库 在 有 效 性 验证 处 理 期 间 调用 什么 客户 端 有 效 性 验证 方法 ? 

5. 使 用 TreeView 控件 有 两 种 方式 : 一 种 方式 是 作为 带 项 和 子 项 的 列表 ， 单 击 它们 时 
能 折 秋 或 展开 ， 另 一 种 方式 是 作为 显示 所 有 项 的 静态 列表 ， 不 能 折 炙 或 展开 。 要 禁止 用 户 
展开 或 折 欠 树 中 的 项 ， 需 要 设置 控件 上 的 什么 属性 呢 ? 

6. 注册 用 户 控件 需要 使 用 什么 指令 ? 

7. 如 何 为 用 户 控 件 添加 属性 ? 
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开发 Web 应 用 程序 通常 需要 考虑 两 个 方面 ， 即 功能 和 外 观 。ASP.NET 提供 了 一 些 可 
在 应 用 程序 中 对 页 面 、 控 件 的 外 观 和 样式 进行 自 定义 的 功能 ， 例 如 可 以 为 某 个 控件 设置 字 
体 、 背 景色 和 前 景色 、 宽 度 以 及 高 度 等 样式 。 本 章 将 全 面 研究 Web 应 用 程序 中 样式 控制 和 
页 面 布局 所 用 到 的 技术 和 使 用 方法 ， 包 括 css 样式 、 主 题 和 母 版 页 。 这 些 技术 对 于 创建 具 
有 一 致 外 观 的 网 站 非常 有 用 ， 也 有 利于 使 站 点 看 起 来 更 有 吸引 力 ， 也 更 加 专业 。 

本 章 学 习 目 标 : 
编写 和 应 用 CSS 样式 
VWD 提供 的 大 量 快速 编写 CSS 的 工具 
创建 和 应 用 主题 
在 主题 中 定义 外 观 
skinID 属性 的 使 用 
创建 母 版 页 和 内 容 页 


4.1 CSS 样式 


Internet 出 现 伊始 ，Web 页 面 主要 由 文本 和 图 像 组 成 。 文 本 是 使 用 纯 HTML 格式 化 的 ， 
这 种 格式 化 所 提供 的 样式 化 页 面 的 选项 很 有 限 。 因 此 诞生 了 css 来 弥补 这 方面 的 缺陷 。 
本 节 将 介绍 CSS 的 概念 、 在 VWD 2010 中 使 用 css 以 及 CSS 的 样式 规则 和 用 法 。 


4.1.1 HTML 格式 化 的 不 足 


使 用 HTML 进行 格式 化 的 问题 之 一 是 它 提 供 的 样式 化 页 面 的 选项 很 有 限 。 可 以 用 
<em>, <strong> 及 <font> 这 样 的 标记 来 改变 文本 的 外 观 , 用 bgcolor 这 样 的 属性 来 改变 HIML 
元 素 的 背景 颜色 ， 还 有 几 个 属性 可 用 来 改变 链接 出 现在 页 面 中 的 方式 。 但 是 很 显然 ， 这 个 
功能 集 不 足以 创建 符合 用 户 期 望 与 需求 的 生动 Web 页 面 。 

另 一 方面 ,在 设计 时 ，HTML 会 强制 要 求 在 HTML 文档 中 嵌入 格式 化 信息 ,使 得 以 后 
难以 对 设计 进行 重用 或 修改 。 

除了 维护 性 问题 之 外 ，HTML 格式 化 的 另 一 个 问题 是 导致 用 户 的 浏览 器 中 不 能 轻松 地 
在 运行 时 修改 格式 。 

HTML 格式 化 的 最 后 一 个 问题 是 ， 页 面 中 的 附加 标记 大 大 增加 了 页 面 的 大 小 。 这 样 ， 
1 于 需要 从 Web 站 点 中 的 各 个 页 面 上 下 载 信息 ， 下 载 和 显示 就 会 变 慢 。 而 且 ， 当 需要 滚动 
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大 型 的 HTML 文件 来 查找 需要 的 内 容 时 ， 页 面 也 会 变 得 难以 维护 。 
简 言 之 ， 使 用 HIML 格式 化 存在 如 下 一 些 问题 。 
e° 它 的 有 限 功能 集 远 远 满足 不 了 页 面 的 格式 化 需求 。 
e 数据 与 表现 混合 在 相同 的 文件 中 。 
° HTML 无 法 在 浏览 器 中 于 运行 时 轻松 地 切换 格式 。 
e 必需 的 格式 化 标记 与 属性 使 页 面 更 大 ， 因 此 加 载 和 显示 更 慢 。 


4.1.2 CSS 简介 


CSS(Cascading Style Sheet),， 中文 译 为 层 翅 样式 表 , 是 用 于 控制 网 页 样式 并 允许 将 样式 
信息 与 网 页 内 容 分 离 的 一 种 标记 性 语言 。 就 语法 而 言 ，CSS 是 一 种 容易 学 习 的 语言 。 它 的 
“语法 ” 仅 由 几 个 概念 组 成 ， 使 得 它 相 当 容 易 入 门 。CSS 的 难点 在 于 所 有 主流 浏览 器 呈现 
页 面 的 方式 。 尽 管 实际 上 每 种 浏览 器 都 能 够 理解 CSS， 但 当 根 据 CSS 标准 显示 页 面 时 ， 它 
们 都 有 各 自 的 “怪兽 ”。 这 个 标准 是 由 提出 HTML 标准 的 同一 个 组 织 W3C(World Wide Web 
Consortium) 提 出 的 ， 它 出 现 过 3 个 版 本 : 1.0、2.1 和 3.0。 在 这 3 个 版 本 中 ，2.1 版 本 是 现 
在 人 们 最 普遍 接受 的 ， 它 包含 了 版 本 1.0 中 的 所 有 内 容 ， 但 是 在 其 基础 上 又 增加 了 大 量 功 
能 。 这 个 版 本 也 是 VWD 默认 使 用 和 生成 的 版 本 。 

CSS 几乎 能 在 所 有 可 能 的 方面 格式 化 Web 页 面 。 它 提供 了 一 套 丰 富 的 选项 , 可 以 修改 
Web 页 面 的 各 个 细微 方面 ， 包 括 字 体 ( 大 小 、 颜 色 和 字体 等 )、 颜 色 和 背景 色 、 围 绕 HTML 
元 素 的 边框 、 元 素 在 页 面 中 的 位 置 以 及 其 他 很 多 方面 。 当 今 所 有 的 主流 浏览 器 基本 都 能 接 
受 CSS， 它 就 是 Web 页 面 可 视 化 表现 的 语言 ， 而 且 在 Web 开发 人 员 中 非常 流行 。 

CSS 规定 了 两 种 定义 样式 的 方法 ， 即 内 联 式 和 级 联 式 。 

1. 内 联 式 样式 


直接 将 样式 控制 放 在 单个 HTML 元 素 内 ， 称 为 内 联 式 或 行内 样式 。 该 样式 通过 style 
属性 来 控制 每 个 元 素 的 外 观 ， 此 方法 直观 但 是 很 繁琐 。 除 非 具有 相同 样式 的 元 素 较 少 ， 和 否 
则 很 少 采 用 。 下 面 是 一 段 采 用 内 联 式 来 控制 各 个 元 素 外 观 的 示例 代码 


<body style="text-align:center"> 

<form id="form1" runat="server"> 

<div style="text-align:center; width:400px; border:solid 1px blue"> 

<hl style="font-size:x-large; color:red "> 欢迎 光临 </h1> 

<h2 style="font-size:large; color:blue "> 这 是 一 个 被 style 修饰 的 页 面 </h2> 
</div> 

</form> 

</body> 


2. 级 联 式 样式 


在 网 页 的 head 部 分 定义 或 导入 的 样式 , 称 为 级 联 式样 式 。 该 样式 可 以 实现 将 网 页 结构 
和 表现 分 离 ， 这 样 ， 当 修改 某 些 元 素 的 样式 时 ， 只 需要 修改 head 部 分 定义 或 引入 的 样式 ， 
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该 网 页 内 所 有 具有 相同 样式 的 元 素 都 会 自动 应 用 新 的 样式 。 

级 联 式 样式 又 可 以 分 为 两 种 方式 ， 即 内 嵌 式 和 链接 式 。 

° ARR 

在 head 部 分 直接 实现 的 CSS 样式 ， 称 为 内 嵌 式 。 这 种 CSS 一 般 位 于 HTML 文件 的 头 
部 ， 即 在 <head> 与 </head> 标 签 内 ， 并 且 以 <style> 开 始 ， 以 </style> 结 束 。 例 如 ， 将 上 面 示 
例 代 码 中 的 样式 抽取 出 来 ， 以 内 嵌 式 级 联 样式 修改 将 得 到 如 下 代码 : 


<head> 
<title> 内 顽 式 样式 </title> 
<style Type="text/css"> 
< 
body{ text-align:center } 
div í text-align:center; width:400px; border:solid 1px blue } 
hl{ font-size:x-large; color:red} 
h2{ font-size:large; color:blue } 
二 
</style> 
</head> 
<body> 
<form id="form1" runat="server"> 
<div> 
<h1> 欢 迎 光 临 </h1> 
<h2> 这 是 一 个 被 style 修饰 的 页 面 </h2> 
</div> 
</form> 
</body> 


其 中 <style> 与 </style> 之 间 是 样式 的 内 容 ， 在 { } 前 面 可 以 写 样式 的 类 型 和 名 称 。{ } 中 
是 样式 的 属性 。 这 种 方法 是 经 常 被 使 用 的 添加 样式 表 的 方法 。 

可 见 ， 采 用 内 棋 式 比 内 联 式 方便 了 很 多 ，body 内 的 代码 也 相对 简洁 ， 修 改 某 个 元 素 的 
样式 时 只 需 修 改 head 内 的 代码 即 可 。 

e 链接 式 

内 红 式 只 解决 了 某 一 个 网 页 内 部 结构 和 表现 分 离 的 问题 ， 但 通常 网 站 都 由 很 多 网 页 组 
成 ， 不 同 网 页 中 的 某 些 元 素 采用 了 相同 的 样式 ， 仍 然 需 要 分 别 设置 ， 因 此 ， 将 样式 放 在 一 
个 单独 的 CSS 文件 中 , 然后 通过 为 每 个 网 页 引入 该 文件 来 实现 统一 的 外 观 将 是 一 种 更 好 的 
在 head 部 分 通过 导入 以 扩展 名 为 .css 的 文件 来 实现 CSS 样式 , 称 为 链接 式 。 利 用 这 种 
方法 在 网 页 中 可 以 调用 已 经 定义 好 的 样式 表 来 实现 样式 表 的 应 用 ， 定 义 好 的 样式 表 通 常 单 
独 以 文件 的 形式 存放 在 站 点 目录 中 。 这 种 方法 实现 了 将 网 页 结构 和 表现 的 彻底 分 离 ， 最 适 
合 大 型 网 站 的 css 样式 定义 。 

例如 ， 将 上 面 示例 中 的 样式 抽取 出 来 以 文件 的 形式 存放 ， 保 存 到 一 个 名 为 style.css 的 
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文件 中 ， 内 容 如 下 : 


body 

{ 
text-align:center; 

} 

div 
text-align:center; 
width:400px; 
border:solid 1px blue; 

) 

hl 

{ 
font-size:x-large; 
color:red; 

) 

h2 

í 
font-size:large; 
color:blue: 

) 


在 页 面 中 ， 可 以 通过 <link> 标 记 引 用 样式 文件 style.css， 代 码 如 下 所 示 : 


<head> 
<title> 链 接 式样 式 </title> 
<link href="style.css" rel="stylesheet" type="text/css" /> 
</head> 
<body> 
<form id="form1" runat="server"> 
<div> 
<hl> 欢 迎 光 临 <hl> 
<h2> 这 是 一 个 被 style 修饰 的 页 面 </h2> 
</div> 
</form> 
</body> 


在 引用 样式 的 标记 <link> 中 ，ref 属性 规定 了 XHTML 与 被 链接 文件 的 关系 ，href 属性 
指定 了 要 链接 的 样式 表 文 件 的 URL,， type 属性 则 规定 了 链接 文件 的 类 型 。 上 述 样式 文件 是 
和 当前 页 面 在 同一 个 目录 下 存放 ， 如 果 不 在 同一 个 目录 下 存放 ， 相 应 的 <link href=" "…> 标 
记 中 href 属性 的 值 则 会 有 所 改变 。 


3. ERRE 
此 外 ,， 如果 某 个 元 素 既 引 用 了 链接 样式 文件 中 定义 的 样式 ， 又 在 head 部 分 定义 了 新 的 
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是 什么 样 呢 ? 下 面 通过 一 个 例子 来 说 明 这 个 问题 。 
例 4-1: 样式 嵌 套 举例 。 


<head> 
<title> 链 接 式 样式 </title> 
<style Type="text/css"> 
<l-- 
h1 { font-weight:bold } 
h2{ color: yellow} 
T 
</style> 
<link rel="stylesheet" href="style.css" type="text/css"> 
</head> 
<body> 
<form id="form1" runat="server"> 
<div> 


<hl style=" font-size:small "> 欢迎 光临 </h1> 


样式 , 或 者 在 元 素 内 部 通过 style 属性 定义 了 新 的 样式 ,那么 该 标记 元 素 最 终 呈 现 的 效果 会 


<h2 style=" font-weight:bold "> 这 是 一 个 被 style 修饰 的 页 面 </h2> 


</div> 
</form> 
</body> 


其 中 ，style.css 文件 是 前 面 创建 的 样式 文件 。 运 行 这 个 HMTL 文件 ， 在 浏览 器 中 可 以 


看 到 ，hl 元 素 内 的 文字 以 粗 体 、 小 号 、 红 色 显 示 ， 而 h2 元 
蓝 色 显 示 。 可 见 ， 链 接 式 样式 中 hl 元 素 的 font-size 属性 和 
属性 都 没有 起 作用 ， 而 不 冲突 的 样式 则 都 会 起 作用 。 这 就 是 
器 解决 这 种 问题 的 方法 就 是 一 旦 发 现 样式 冲突 ， 则 通过 “就 


素 内 的 文字 则 以 粗 体 、 大 号 、 

ARRE. h2 元 素 的 color 
样式 尾 套 中 的 冲突 问题 ， 浏 览 
近 使 用 ”原则 ， 采 用 距离 该 元 


素 最 近 的 样式 进行 显示 ， 而 不 冲突 的 样式 则 通过 顺序 组 合 后 形成 最 终 样式 进行 显示 。 
- 般 情 况 下 ， 在 样式 表 (.css) 文 件 中 定义 适合 大 多 数 网 页 公用 的 样式 ， 在 网 页 内 部 采用 


内 嵌 式 定义 该 页 面 特有 的 样式 ， 内 联 式样 式 定义 个 别 元 素 的 
其， 从 而 使 样式 控制 真正 灵活 、 方 便 。 


4.1.3 CSS 属性 


属性 是 元 素 的 一 部 分 ， 可 通过 样式 表 修 改 。CSS 规范 定 
多 数 Web 站 点 中 不 会 用 到 所 有 项 。 表 4-1 列 出 了 部 分 常见 的 
用 场合 。 


样式 ， 再 结合 可 视 化 的 开发 工 


义 了 一 个 长 属性 列表 ， 但 在 大 
CSS 属性 , 并 说 明了 它们 的 应 
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-js 


CSS 属性 
background-color 


background-image 


表 4-1 常见 的 CSS 属性 
描述 


指定 元 素 的 背景 色 或 图 像 


示例 
backeround-color: White; 


background-image: url(Imaee jpg): 


border 指定 元 素 的 边框 border: 3px solid black; 

color 修改 字体 颜色 color: Green; 
display: none; 

display 修改 元 素 的 显示 方式 ， 允 许 隐藏 或 显示 它们 | 这 种 设置 使 元 素 被 隐藏 ， 不 占用 任 
何 屏 幕 空间 
float: left; 

ià 允许 用 左 浮动 或 右 浮动 将 元 素 浮动 在 页 面 | 该 设 定 使 跟着 一 个 浮动 的 其 他 内 容 

上 。 其 他 的 内 容 则 被 放 在 相对 的 位 置 上 被 放 在 元 素 的 右上 角 。 本 章 也 将 介 

绍 它 的 工作 原理 

font-family font-family: Arial: 

font-size font-size: 18px; 

修改 页 面 上 使 用 的 字体 外 观 

font-style font-style: italic; 

font-weight font-weight: bold: 

i 设置 页 面 中 元 素 的 高 度 或 宽度 soqo, 

width width: 200px: 

margin 设置 元 素 内 部 (内 边 距 ) 或 外 部 (页 边 距 ) 的 可 | padding: 0: 

padding 用 空间 margin: 20px: 

SATTAR ETTA. Kig “ini hidden; 
visibility 这 会 使 元 素 不 可 见 。 但 仍然 会 占用 


VWD 会 通过 它 的 许多 CSS 工具 找到 恰 


仍然 会 占用 屏幕 空间 ， 只 是 看 不 到 它们 而 已 


页 面 的 原始 空间 


当 的 属性 ， 因 此 不 必 全 部 记 住 它们 。 


4.2 在 VWD 中 使 用 CSS 


VWD 中 有 几 个 使 用 CSS 的 便利 工具 ， 如 下 所 示 。 
工具 栏 : 用 来 快速 访问 并 创建 新 规则 与 样式 。 
e “CSS 属性 ”面板 : 用 来 修改 属性 值 。 
e “管理 样式 ”窗口 :用 来 组 织 站 点 的 样式 ， 将 它们 从 内 赃 样 式 表 改 为 外 部 样式 表 ， 


° “样式 表 ” 


反之 亦 然 ; 对 它们 重新 排序 ; 将 现 有 样式 表 链 接 到 一 个 文档 ; 创建 新 的 内 联 、 内 峰 
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° “应 用 样式 ”窗口 : 用 来 从 站 点 中 选择 所 有 可 用 样式 , 并 将 它们 快速 应 用 到 页 面 中 
的 不 同 元 素 上 。 
e “添加 样式 规则 ”对 话 框 : 用 于 构建 较 复 杂 的 选择 器 。 


4.2.1 新 建 样式 


在 VWD 2010 中 使 用 Css 非常 方便 , 即 可 以 在 “ 源 ”视图 中 利用 VWD 的 “智能 提示 ” 
功能 设置 各 种 样式 ， 也 可 以 利用 可 视 化 的 对 话 框 和 便利 工具 快速 完成 各 种 样式 的 设置 。 

1. 在 源 视图 下 设置 样式 

在 “ 源 ” 视 图 下 ， 利 用 系统 提供 的 智能 提示 功能 ， 可 以 方便 地 设置 各 种 元 素 的 样式 内 
联 式样 式 ， 有 具体 步骤 如 下 。 

(1) 在 想 要 设置 格式 的 HTML 标记 内 ， 输 入 style="， 并 按 空 格 键 ， 将 弹出 VWD 2010 
提供 的 “智能 提示 ”工具 ， 如 图 4-1 所 示 。 

(2) 定义 任意 数量 的 属性 (“ 属 性 : 值 ”对 )， 属 性 之 间 用 分 号 分 隔 。 

2. 在 可 视 化 窗口 中 设置 样式 

利用 可 视 化 窗口 设置 样式 的 方法 有 很 多 ， 可 以 在 “ 源 ” 视 图 或 者 “设计 ”视图 下 选中 
某 个 标记 元 素 , 然后 单 击 “ 属 性 ”面板 中 style 属性 后 面 的 省 略 号 按钮 ,将 打开 “修改 样式 ” 
对 话 框 ， 如 图 4-2 所 示 。 

该 对 话 框 分 为 两 个 窗 格 ， 左 窗 格 列 出 了 9 个 类 别 ， 当 选择 某 个 类 别 时 ， 右 窗 格 中 将 显 
示 所 选 类 别 下 的 选项 。 设 置 了 样式 选项 并 单 击 “确定 ”按钮 后 , 新 的 样式 定义 将 自动 在 “ 源 ” 
视图 中 生成 ， 也 可 以 在 “设计 ”视图 下 查看 最 新 的 效果 。 
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l batail ` 
ra b > jent- deser atisa 
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= - irs 
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xa | 
加 Wtie 回 ED 
图 4-1 VWD 的 “智能 提示 ”工具 图 4-2 “修改 样式 ”对 话 框 


这 种 方法 只 能 将 定义 的 样式 属性 以 内 联 式 生 成 ,， 放 在 每 个 元 素 的 style 属性 中 。 如 果 要 
定义 内 嵌 式 样式 可 以 使 用 如 下 步骤 。 
(1) 切换 到 “设计 ”视图 ， 在 “格式 设置 ”工具 栏 的 “目标 规则 ”列表 中 ， 选 择 “ 应 
新 样式 ”选项 ， 如 图 4-3 所 示 。 
(2) 此 时 将 打开 “新 建 样式 ”对 话 框 ， 该 对 话 框 与 “修改 样式 ”对 话 框 相似 ， 所 不 同 
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的 是 “新 建 样式 ”对 话 框 中 包含 了 “选择 器 ”用 于 选择 对 哪 一 个 标记 进行 定义 ， 以 及 通过 
“定义 位 置 ” 将 当前 定义 存放 到 哪里 ， 如 图 4-4 所 示 。 

在 “选择 器 ”列表 中 选择 某 个 选择 器 ， 如 bgsound， 就 可 以 创建 应 用 于 所 有 bgsound 
元 素 的 样式 。“ 定 义 范围 ”列表 设置 为 “当前 网 页 ”, 表示 该 样式 规则 在 当前 页 的 style 元 
素 中 创建 。 若 想 查 看 已 创建 的 样式 规则 ， 可 以 切换 到 “ 源 ” 视 图 并 滚动 到 style 元 素 ， 该 
元 素 位 于 <head> 标 记 内 。 
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图 4-3 选择 应 用 新 样式 图 4-4 “新 建 样式 ”对 话 杠 


3. 使 用 “CSS 属性 ”面板 


可 以 使 用 “Css 属性 ”面板 对 正在 定义 的 内 嵌 式 样式 规则 进行 修改 ， 有 具体 步骤 如 下 。 

(1) 单 击 要 修改 样式 的 元 素 , 选中 部 分 以 蓝 色 框 包围 并 有 一 个 标签 指示 ha3 元 素 已 选中 。 

(2) 选择 “视图 ”|“CSS 属性 ”命令 ， 打 开 “CSS 属性 ”面板 ， 可 以 看 到 h3 元 素 的 
CSS 属性 列表 ， 如 图 4-5 所 示 。 

(3) 通过 该 面板 可 以 根据 需要 设置 CSS 属性 。 

在 CSS 属性 列表 中 所 做 的 修改 可 以 立即 通过 “设计 ”视图 显示 出 来 ， 如 果 要 观察 样式 
代码 ， 可 以 切换 到 “ 源 ” 视 图 并 滚动 到 style 元 素 处 进行 查看 。 

4. 新 建 样式 表 文 件 


使 用 css 的 另 一 个 有 效 方 法 是 将 样式 规则 放 入 独立 的 样式 表 文 件 中 。 然 后 所 有 页 面 
都 可 以 引用 这 些 样 式 ， 这 样 可 以 使 这 些 页 面 看 起 来 非常 一 致 。 

例 4-2: 新 建 样式 表 文 件 , 并 将 例 4-1 中 h2 元 素 的 样式 副本 添加 到 新 建 的 样式 表 文 件 中 。 

(1) 启动 VWD 2010， 选 择 “ 文 件 ”|“ 新 建 网 站 ”命令 ， 新 建 空 网 站 Chapter4。 

(2) 在 “解决 方案 资源 管理 器 ”中 ， 右 击 解决 方案 的 名 称 ， 从 弹出 的 快捷 菜单 中 选择 
“添加 现 有 项 ”命令 。 将 例 4-1 中 的 HTML 文件 添加 到 项 目 中 。 

(3) 通过 “添加 新 项 ”对 话 框 ， 在 “模板 ”列表 中 选择 “样式 表 ” 选 项 ， 新 建 样式 表 
StyleSheet.css。 此 时 ， 编 辑 器 将 打开 一 个 包含 空 body 样式 规则 的 新 样式 表 。 

(4) 选择 “视图 ”|“ 管 理 样式 ”命令 ,打开 “管理 样式 ”窗口 ， 此 时 该 窗口 中 会 列 出 
样式 文件 中 的 样式 和 当前 网 页 中 的 内 散 样 式 。 
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(5) 右 击 当前 网 页 中 的 h2 样式 ， 从 弹出 的 快捷 菜单 中 选择 “新 建 样式 副本 ”命令 ， 如 
图 4-6 所 示 。 


选择 全 部 1 TRAO 
KERRO. 
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图 4-5 “CSS 属性 ”面板 图 4-6 “管理 样式 ”窗口 
此 时 将 打开 “新 建 样式 ”对 话 框 ， 人 允许 创建 一 个 基于 当前 选项 的 新 样式 ， 在 “选择 器 ” 
下 拉 列 表 中 将 默认 自动 选择 h2， 在 “定义 位 置 ” 下 拉 列 表 中 选择 “ 现 有 样式 表 ” 选 项 ， 在 
URL 下 拉 列 表 中 选择 StyleSheet.css 选项 ， 如 图 4-7 所 示 。 
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图 4-7 “新 建 样式 ”对 话 框 


(6) 单 击 “确定 ”按钮 关闭 对 话 框 。VWD 会 创建 h2 样式 的 一 个 副本 ， 并 把 它 放 在 样 
式 表 文件 StylesSheetcss 中 。 

接 下 来 ， 可 以 将 当前 网 页 中 的 h2 样式 删除 ， 改 为 使 用 样式 表 文 件 中 的 样式 。 

(7) 在 “管理 样式 ”窗口 中 ， 再 次 右 击 当 前 网 页 中 的 h2 样式 ， 从 弹出 的 快捷 菜单 中 选 
择 “ 删 除 ” 命 令 。 这 样 会 把 样式 属性 从 <head> 标 记 内 删除 。 

(8) 打开 或 切换 到 例 4-1 中 的 HTML 页 ， 切 换 到 “设计 ”视图 。 选 择 “格式 ”|“ 附 加 
样式 表 ” 命 令 ， 打 开 “ 选 择 样式 表 ” 对 话 框 ， 选 择 刚 才 创建 的 样式 表 文 件 StyleSheet.css， 
单 击 “ 确 定 ” 按 钮 。 

(9) 执行 上 述 操作 后 ， 在 “ 源 ” 视 图 中 可 以 看 到 ， 在 <head> 标 记 中 将 添加 如 下 代码 : 


<link href="StyleSheet.css" rel="stylesheet" type="text/css" /> 
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通过 以 上 步骤 即 可 完成 将 内 嵌 式 样式 移 到 样式 表 文件 中 的 操作 。 
422 样式 规则 


一 个 样式 表 由 若干 个 样式 规则 组 成 。 样 式 规则 是 指 网 页 元 素 的 样式 定义 ， 包 括 元 素 的 
显示 方式 以 及 元 素 在 页 中 的 位 置 等 。 打 开 前 面 添加 的 样式 表 文 件 StyleSheet.css， 在 其 中 单 
击 鼠 标 右键 ， 从 弹出 的 快捷 菜单 中 选择 “添加 样式 规则 ”命令 , 将 打开 如 图 4-8 所 示 的 “ 添 
加 样式 规则 ”对 话 框 。 

在 该 对 话 框 中 选择 某 个 元 素 ， 也 可 定义 一 个 类 或 定义 一 个 元 素 ID， 单 击 “ 确 定 ”按钮 
即 可 添加 一 个 新 的 样式 规则 。 例 如 ， 添 加 一 个 元 素 img， 在 样式 表 文 件 中 可 以 看 到 如 下 新 
建 的 样式 规则 。 


img 
{ 
3: 
该 规则 默认 是 仅 有 元 素 名 称 的 空 规则 ， 在 大 括号 内 单 击 鼠标 右键 ， 从 弹出 的 快捷 菜单 
中 选择 “生成 样式 ”命令 ， 即 可 打开 “修改 样式 ”对 话 框 ， 进 行 样式 定义 和 修改 。 
无 论 是 定义 内 嵌 式 样式 还 是 链接 式样 式 , 每 个 样式 的 定义 格式 都 是 一 样 的 , 如 下 所 示 : 
样式 定义 选择 符 { 属性 1: 值 1; 属性 2: 值 2 ……- ) 
其 中 ， 样 式 定义 选择 符 是 指 样式 定义 的 对 象 ， 可 以 是 HTML 标记 元 素 ， 也 可 以 是 用 户 
自 定义 的 类 、 用 户 自 定义 的 ID、 伪 类 和 伪 元 素 等 。 
1. 标记 选择 符 
任何 HTML 元 素 都 可 以 是 一 个 CSS 的 标记 选择 符 。 标 记 选 择 符 仅仅 是 指向 特别 样式 
的 元 素 。“ 添 加 样式 规则 ”对 话 框 中 的 “元 素 ” 下 拉 列 表 中 提供 了 所 有 可 供 使 用 的 标记 选 
择 符 。 
2. 类 选择 符 
每 一 个 标记 选择 符 都 能 自 定义 不 同 的 类 ， 从 而 允许 同一 元 素 具 有 不 同 的 样式 。 指 定 某 
个 标记 选择 符 内 的 自 定义 类 的 一 般 形 式 为 : 
标记 选择 符 .类 名 {样式 属性 1: 值 1; 样式 属性 2: 值 2;: ……} 


在 “添加 样式 规则 ”对 话 框 中 先 选 择 “ 类 名 ” 单 选 按钮 ， 在 文本 框 中 输入 one， 然 后 
选中 “可 选 元 素 ” 复 选 框 ， 在 其 下 拉 列 表 中 选择 p 元 素 ， 即 可 自动 生成 pone 样式 规则 ， 
如 图 4-9 所 示 。 
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图 4-8 “添加 样式 规则 ”对 话 框 图 4-9 添加 p.one 样式 规则 


单 击 “ 确 定 ” 按 钮 将 生成 仅 有 类 名 称 的 空 规则 ， 在 大 括号 内 单 击 鼠 标 右键 ， 从 弹出 的 
快捷 菜单 中 选择 “生成 样式 ”命令 ， 打 开 “ 修 改 样式 ”对 话 框 ， 设 置 字体 的 color 属性 为 
红色 ， 相 应 的 代码 如 下 : 


p.one 


color: red; 


) 
用 同样 的 方法 ， 定 义 p.two 类 选择 符 样 式 ， 设 置 字体 的 color 属性 为 蓝 色 。 
接 下 来 , 就 可 以 在 代码 中 引用 类 选择 符 ， 其 方法 是 通过 元 素 的 class 属性 来 实现 的 ， 例 
如 ， 下 面 的 代码 ， 其 显示 效果 如 图 4-10 所 示 。 
<p class="one"> 类 别 选择 器 1</p> 
<p class="two"> 类 别 选 择 器 2</p> 


其 含义 是 在 p 中 引用 one 会 以 红色 样式 显示 ， 在 p 中 引用 two 会 以 蓝 色 样式 显示 。 
类 选择 符 的 定义 也 可 以 与 标记 选择 符 无 关 ， 这 样 ， 类 选择 符 就 可 以 应 用 于 任何 元 素 。 
这 种 自 定义 类 选择 符 的 形式 如 下 : 


.类 名 {样式 属性 1: 值 1; 样式 属性 2:48 2; ……} 
创建 这 种 类 选择 符 时 ， 只 要 不 选中 “可 选 元 素 ” 复 选 框 即 可 。 
3. ID 选择 符 


ID 选择 符 用 于 分 别 定义 每 个 具体 元 素 的 样式 。 一 个 ID 选择 符 的 指定 要 有 指示 符 # 在 名 
字 前 面 。 使 用 时 通过 指定 元 素 的 id 属性 来 关联 。 例 如 : 


#index { color:blue ) 
引用 时 ， 使 用 id 属性 声明 即 可 。 

<p id="index"> 本 段落 的 颜色 为 蓝 色 </p> 
自 定义 ID 选择 符 与 自 定义 类 选择 符 的 方式 非常 相似 ， 在 “添加 样式 规则 ”对 话 框 中 ， 
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选择 “元 素 ID ” 单 选 按钮 ， 输 入 相应 的 名 称 即 可 。 但 是 两 者 在 使 用 上 是 有 区 别 的 。 在 同一 
个 网 页 中 ， 多 个 标记 元 素 可 以 使 用 同一 个 自 定 义 类 选择 符 ， 而 ID 选择 符 只 能 为 某 一 个 标 
记 元 素 使 用 。 这 种 选择 符 应 该 尽量 少 用 ， 因 为 它 有 一 定 的 局 限 性 。 

技巧 : 

如 果 在 一 个 元 素 的 样式 定义 中 ， 既 有 标记 选择 符 ， 又 有 自 定 义 类 选择 符 和 自 定义 ID 
选择 符 ， 那 么 自 定义 ID 选择 符 的 优先 级 最 高 ， 其 次 是 自 定义 类 ， 标 记 选 择 符 的 优先 级 最 低 。 


4. 关联 选择 符 


关联 选择 符 是 一 个 用 空格 隔 开 的 两 个 或 更 多 的 单一 标记 选择 符 组 成 的 字符 串 。 一 般 格 
式 如 下 : 
选择 符 1 选择 符 2 …… {属性 : 值 ; =} 
这 些 选择 符 具有 层次 关系 ， 并 且 它 们 的 优先 级 比 单一 的 标记 选择 符 大 。 例 如 : 
p h2{ color:red } 
这 种 定义 方式 只 对 p 元 素 所 包含 的 h2 元 素 起 作用 ， 单 独 的 p 或 者 单独 的 h2 元 素 均 无 
法 应 用 该 样式 。 在 “添加 样式 规则 ”对 话 框 中 先 添 加 p 选择 符 ， 单 击 “>” 按 钮 将 其 添加 
到 “样式 规则 层次 结构 ”中 ， 然 后 在 添加 h2 元 素 ， 如 图 4-11 所 示 ， 如 果 层 次 结构 有 变化 ， 
还 可 以 通过 “上 移 ” 和 “下 移 ” 按 钮 进行 修改 。 


i or 
x= PRAWEALHH OD: 
Í z] `. 
OssO Tü Q 
mel le] == 
| 类别 选择 器 1| - 
9548382 Se ar 
~) (m m] 
图 4-10 引用 类 选择 符 应 用 样式 图 4-11 定义 关联 选择 符 


这 种 方式 不 仅 适 用 于 标记 选择 符 ， 还 可 以 关联 自 定义 用 户 类 ， 自 定义 ID 以 及 任何 样 
式 选 择 符 。 

5. 并 列 选择 符 

如 果 有 多 个 不 同 的 元 素 定义 的 样式 相同 ， 则 可 以 使 用 并 列 选择 符 简化 定义 。 例 如 : 


h1,h2,h3{ color:blue} 


每 个 元 素 之 间 用 逗号 隔 开 ， 表 示 所 有 的 hl h2, h3 标记 中 的 内 容 都 将 以 蓝 色 样 式 显示 。 
6. 伪 类 
伪 类 是 CSS 中 非常 特殊 的 类 ， 它 能 自动 地 被 支持 CSS 的 浏览 器 所 识别 。 伪 类 可 以 指 
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定 XHTML 中 的 <a> 元 素 以 不 同 的 方式 显示 链接 (links)、 已 访问 链接 (visited links) 和 可 激活 
链接 (active links)。 其 中 ， 一 个 已 访问 链接 可 以 定义 为 不 同 颜色 的 显示 ， 甚 至 不 同 字 体 大 小 
和 风格 。 
CSS 中 用 4 个 伪 类 来 定义 链接 的 样式 ， 分 别 是 : a:link、a:visited、a:hover 和 a:active, 
例如 : 
a:link {font-weight : bold ;text-decoration : none :color : #C00000 ;} 
a:visited {font-weight : bold :text-decoration : none :color : #C30000 ;} 
a:hover {font-weight : bold ;text-decoration : underline :color : #F60000 ;} 
a:active {font-weight : bold ;text-decoration : none :color : #F90000 ;} 
以 上 语句 分 别 定义 了 链接 、 已 访问 过 的 链接 、 鼠 标 停 在 上 方 时 、 点 下 鼠标 时 的 样式 。 
注意 ， 必 须 按 以 上 顺序 写 ， 和 否则 显示 可 能 和 预想 的 不 一 样 。 


4.2.3 应 用 样式 


在 VWD 中 ， 通 过 “应 用 样式 ”对 话 框 可 以 快速 地 为 页 面 中 的 元 素 应 用 已 经 定义 好 的 
CSS 样式 。 选 择 “视图 ”|“ 应 用 样式 ”命令 即 可 打开 “应 用 样式 ”窗口 。 

例 4-3: 通过 “应 用 样式 ”窗口 对 页 面 中 的 元 素 应 用 样式 规则 。 

(1) 首先 ， 在 要 应 用 样式 的 页 面 的 “设计 ”视图 ， 选择“ 格式 ”|“ 附 加 样式 表 ” 命 令 ， 
将 前 面 创建 的 样式 表 文 件 StyleSheet.css 附加 到 页 面 。 

(2) 选择 “视图 ”|“ 应 用 样式 ”命令 ， 打 开 “ 应 用 样式 ”窗口 。 

(3) 该 窗口 显示 了 它 在 当前 页 面 中 找到 的 所 有 选择 器 和 附加 的 任何 样式 表 。 如 果 没 有 
看 到 ， 也 可 以 单 击 该 窗口 工具 栏 中 的 “选项 ”按钮 并 选择 “显示 所 有 样式 ”命令 。 

(4) 将 光标 定位 到 要 应 用 样式 的 元 素 处 ， 如 <p> 元 素 ， 此 时 “应 用 样式 ”窗口 中 将 显示 
当前 可 用 的 样式 ， 单 击 pone 类 ， 或 者 单 击 右 侧 的 下 拉 菜 单 按钮 ， 从 弹出 的 下 拉 菜 单 中 选 
择 “ 应 用 样式 ”命令 ， 如 图 4-12 所 示 。 


图 4-12 应 用 样式 
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(5) 切换 到 “ 源 ” 视 图 ， 可 以 看 到 VWD 会 向 <p> 标 记 添加 一 个 class 属性 : 
<p class="one" >CSS 样式 示例 </p> 


说 明 : 
如 果 要 应 用 多 个 类 ， 则 在 单 击 列表 中 其 他 类 时 ， 按 住 Ctrl 键 ， 这 样 就 会 应 用 一 个 类 列 
表 ， 元 素 的 class 属性 之 间 由 一 个 空格 隔 开 。 


(6) 单 击 “ 应 用 样式 ”窗口 中 的 “清除 样式 ”选项 ， 可 以 快速 地 从 标记 中 删除 现 有 类 
和 内 联 样式 。 


43 页 面 布局 


除了 为 页 面 的 内 容 设置 样式 ， 页 面 元 素 的 布局 和 定位 是 否 合理 也 是 衡量 网 页 设计 是 否 
美观 的 重要 指标 。 本 节 将 介绍 网 页 的 基本 布局 方式 、 页 面 元 素 的 定位 以 及 表格 布局 和 层 
布局 。 


434 网 页 的 基本 布局 方式 


常见 的 网 页 布局 方式 有 左 对 齐 、 居 中 和 满 宽 度 显 示 。 默 认 情况 下 ， 网 页 内 容 是 水 平 左 
对 齐 的， 然而 ， 在 实际 页 面 中 ， 常 用 的 布局 方式 是 页 面 水 平 居中 和 满 宽度 显示 。 
1. 页 面 水 平 居中 


设置 页 面 水 平 居中 的 方法 是 在 body 的 style 样式 中 设置 text-align 属性 的 值 为 center。 
如 果 还 希望 页 面 的 宽度 固定 ， 则 可 以 通过 设置 div 的 width 属性 来 实现 。 例 如 下 面 的 代码 : 


<body style="text-align:center; "> 
<form id="form1" runat="server"> 
<div id="div1" style="width:760px; text-align:center; height:200px"></div> 
</form> 
</body> 


2. 页 面 满 宽度 显示 


设置 页 面 满 宽 显 示 的 方法 是 将 div 的 固定 宽度 设置 为 百分比 ， 这 样 宽度 就 会 随 显示 界 
面 的 大 小 自动 调整 。 例 如 下 面 的 代码 : 
<body style="text-align:center; "> 


<form id="form1" runat="server"> 
<div id="div1" style="width:98%; text-align:center; height:200px"></div> 
</form> 
</body> 
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这 种 布局 方式 的 优点 是 ， 无 论 浏览 器 是 否 最 大 化 显示 ， 都 不 会 出 现 横向 滚动 条 ， 缺点 
是 页 面 元 素 相对 位 置 不 固定 ， 不 利于 用 户 和 窗 体 之 间 的 操作 。 


432 页 面 元 素 定 位 


页 面 元 素 的 定位 分 为 流 布 局 和 坐标 定位 布局 两 种 ， 其 中 ， 坐 标定 位 布局 又 分 为 绝对 定 
位 和 相对 定位 ， 这 里 仅 介绍 流 布 局 和 坐标 绝对 定位 。 
1. 流 布 局 static 


如 果 采 用 该 布局 ， 则 页 面 中 的 元 素 将 按照 从 左 到 右 、 从 上 到 下 的 顺序 显示 ， 各 元 素 之 
间 不 能 重 琶 。 如 果 不 设置 元 素 的 定位 方式 ， 则 默认 就 是 流 式 布局 。 
2. 坐标 绝对 定位 absolute 


在 使 用 坐标 绝对 定位 之 前 ， 必 须 先 将 style 元 素 的 position 属性 设置 为 absolute， 然 后 
就 可 以 由 style 元 素 的 left, top. right, bottom 和 z-index 属性 来 决定 元 素 在 页 面 中 的 绝对 
位 置 。left 属性 表示 元 素 的 x 坐标 ，top 属性 表示 元 素 的 y 坐标 ， 坐 标的 位 置 是 以 它 最 近 的 
具有 position 属性 的 父 容器 为 参照 物 的 。 

例 4-4: 页 面 元 素 的 定位 方式 演示 。 

(1) 启动 VWD 2010, 打开 网 站 Chapter4， 通 过 “添加 新 项 ”对 话 框 在 该 网 站 中 添加 一 
个 名 为 Default.aspx 的 Web 窗 体 页 。 

(2) 修改 页 面 <body> 内 的 代码 如 下 所 示 : 


<body> 
<form id="form1" runat="server"> 
<div id="div1" style="border: 1px #000080 solid; text-align: left; width:350px; height: 200px;"> 
<div id="div2" style="width: 200px; height: 120px; text-align: left; border: 1px #00FF00 solid; 
background-color: #E080F0"> 
<div id="div3"style="position: absolute; top: 76px; left: 123px; width: 150px; height: 
100px; border: 2px #800000 solid; background-color: #FFFF00"> 
<div id="div4" style="position: absolute; left: 23px; top: 30px; width: 100px; height: 
60px; border: 3px #FF00FF solid; background-color: #00FFFF"> 
</div> 
</div> 
</div> 
</div> 
</form> 
</body> 


然后 切换 到 “设计 ”视图 ， 观 察 其 显示 的 效果 ， 如 图 4-13 所 示 。 运 行 该 页 面 ， 可 以 看 
到 ， 无 论 浏览 器 窗口 如 何 变化 ， 各 层 之 间 的 位 置 仍然 保持 不 变 。 

(3) 具有 不 相同 z-index 值 的 元 素 可 以 重 登 ,其 效果 就 像 多 张 透 明 的 纸 按 顺 序 登 放 在 一 
起 。 其 中 ，z-index 值 大 的 元 素 会 覆盖 z-index 值 小 的 元 素 。 为 div3 元 素 增 加 z-index 属性 ， 
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如 下 : 


<div id="div3" style="position: absolute; ...... z-index: -1;"> 


此 时 ，“ 设 计 ” 视 图 的 效果 如 图 4-14 所 示 。 


Luvæuvé | 


图 4-13 绝对 定位 的 页 面 效果 图 4-14 设置 z-index 属性 后 的 效果 


采用 坐标 定位 的 方式 可 以 精确 地 将 元 素 放 在 页 面 中 相应 的 位 置 上 ， 但 是 由 于 不 同 浏览 
器 在 显示 方面 存在 的 差异 ， 也 会 给 整体 页 面 布 局 带 来 混乱 的 效果 ， 解 决 这 一 问题 的 方法 就 


是 使 用 表格 布局 。 
433 ”表格 布局 


利用 表格 可 以 将 网 页 中 的 内 容 合理 地 放置 在 相应 的 区 域 ， 每 个 区 域 之 间 互 不 干扰 。 例 
如 ， 设 计 一 个 表格 用 来 布局 网 页 首页 ， 实 现 如 图 4-15 所 示 的 效果 。 


标题 区 
回 导航 区 
左边 主体 部 分 右边 
页 脚 区 
图 4-15 表格 布局 
例 4-5: 创建 表格 ， 通 过 该 表格 实现 如 图 4-15 所 示 页 面 布局 效果 。 
从 图 中 可 以 看 出 ， 表 格 中 定义 了 1 个 标题 区 ，1 个 导航 区 ，1 个 页 脚 区 ， 中 间 又 分 成 3 
个 区 ， 这 就 需要 先 创建 一 个 4 行 3 列 的 表格 ， 然 后 再 通过 详细 设置 达到 图 中 的 效果 。 


(1) 启动 VWD 2010,， 打 开 网 站 Chapter4， 通过 “添加 妆 
个 名 为 Table.aspx 的 Web 窗 体 页 。 


项 ”对 话 框 在 该 网 站 中 添加 一 


(2) 切换 到 “设计 ”视图 ， 将 鼠标 光标 停 在 div 标记 内 。 选 择 “ 表 ”|“ 插 入 表 ” 命 令 ， 


打开 “插入 表格 ”对 话 框 ， 定 义 表格 大 小 为 4 行 3 列 ， 指 定 
框 颜色 为 红色 。 如 图 4-16 所 示 。 
G) 选中 第 一 行 的 3 个 单元 格 ， 选 择 “ 表 ”|“ 修 改 ”|“ 
(4) 用 同样 的 方法 合并 第 2 行 和 第 4 行 的 3 个 单元 格 。 


宽度 为 100%， 边 框 值 为 1， 边 


合并 单元 格 ”命令 ， 将 其 合并 。 
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图 4-16 “插入 表格 ”对 话 框 


(5) 单 击 表格 之 外 的 其 他 空白 处 ， 此 时 “设计 ”视图 的 左上 角 将 显示 body 标记 ， 单 击 
此 处 ， 将 选择 所 有 body 区 域 中 的 元 素 ， 然 后 选择 “格式 ”|“ 两 端 对 其 ”|“ 居 中 ”命令 ， 
使 得 页 面 中 所 有 文字 都 居中 显示 , 切换 到 “ 源 ” 视图 , 可 以 看 到 body 元 素 添 加 了 如 下 样式 。 

<body style="text-align: center"> 

(6) 分 别 选 中 第 3 行 的 第 1 个 单元 格 和 第 3 个 单元 格 ， 然 后 在 “属性 ”面板 中 设置 其 
Width 属性 为 20%. 

(7) 分 别 在 不 同 区 域 输入 如 图 4-15 所 示 的 区 域 文本 。 

如 果 对 以 上 布局 不 满意 ， 还 可 以 直接 在 “ 源 ” 视 图 中 修改 响应 的 属性 信息 。 表 4-2 中 
列 出 了 表格 中 部 分 常用 的 属性 。 


表 4-2 常用 的 表格 属性 
属 性 说 明 
表示 边框 宽度 ， 如 果 设 置 为 0， 表 示 无 边框 ， 此 时 默认 frame=void, rules=none; 可 


Border N" 
以 设置 为 大 于 0 的 值 来 显示 边框 ， 此 时 默认 frame=border, rules=all 
Cellspacing 表示 单元 格 间距 (表格 和 tr 之 间 的 间隔 ) 


Cellpadding 表示 单元 格 衬 距 (td 和 单元 格 内 容 之 间 的 间隔) 

表示 如 何 显示 表格 边框 ，void: 无 边框 (默认 ); above: 仅 有 顶部 边框 ，below: 仅 有 
Frames 底部 边框 ，hsides: 仅 有 项 部 和 底部 边框 ，vsides: 仅 有 左右 边框 ; lhs: 仅 有 左边 框 ; 
rhs: 仅 有 右边 框 ，box 和 border: 包含 全 部 4 个 边框 

表示 如 何 显示 表格 内 的 分 隔 线 ，all: 显示 所 有 分 隔 线 ;: cols: 仅 显 示 列 线 ; rows: 仅 
ERT: groups: 仅 显 示 组 与 组 之 间 的 分 隔 线 


Rules 
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表格 布局 的 最 大 优点 是 简单 直观 。 但 是 如 果 将 整个 网 页 的 元 素 都 包含 在 表格 内 ， 则 浏 
览 器 会 将 整个 表格 全 部 下 载 完毕 后 才 显 示 表 格 中 的 内 容 ， 因 此 网 页 显示 速度 慢 。 此 外 ， 表 
格 布局 也 不 利于 网 页 结构 和 表现 的 分 离 。 解决 该 问题 的 方法 就 是 网 页 整体 采用 DIV 和 CSS 
进行 层 布 局 ， 局 部 用 表格 进行 布局 。 这 是 当前 Web 标准 推荐 的 最 佳 布局 方法 。 


4.3.4 DIV 和 CSS 布局 


在 传统 的 表格 布局 中 , 完全 依赖 于 表格 对 象 TABLE, 通常 , 在 页 面 中 绘制 多 个 单元 格 ， 
在 表格 中 放置 内 容 ， 通 过 表格 的 间距 或 者 用 无 色 透 明 的 GIF 图 片 来 控制 布局 版 块 的 间距 ， 
达到 排版 的 目的 。 而 以 DIV 对 象 为 核心 的 页 面 布局 中 ， 通 过 层 来 定位 ， 通 过 css 定义 外 
观 ， 最 大 程度 地 实现 结构 和 外 观 彻底 分 离 的 布局 效果 ， 因 此 习惯 上 对 层 布局 又 称 为 DIV 和 
CSS 布局 。 

层 布局 最 核心 的 标签 就 是 DIV。DIV 是 一 个 容器 ， 在 使 用 时 以 <div></div> 形 式 存在 。 
在 XHTML 中 ,每 一 个 标签 都 可 以 称 为 容器 ， 能够 放置 内 容 。 但 DIV 是 XHTML 中 专门 用 
于 布局 设计 的 容器 对 象 。 

添加 层 的 方法 非常 简单 ， 直 接 在 “ 源 ” 视 图 中 创建 一 对 <div></div> 标 记 即 可 。 也 可 以 
通过 “工具 箱 ” 中 的 HTML 服务 器 控件 Div 来 创建 。 

1. 盒子 模型 


自从 1996 年 CSS1 的 推出 , W3C 组 织 就 建议 把 所 有 网 页 上 的 对 象 都 放 在 一 个 盒子 (box) 
中 ， 设 计 师 可 以 通过 创建 定义 来 控制 这 个 盒子 的 属性 ， 这 些 对 象 包括 段落 、 列 表 、 标 题 、 
图 片 以 及 层 。 盒 子 模型 主要 定义 了 4 NKR, 内 容 (content)、 边框 距 (padding)、 边 界 (border) 
和 边 距 (margin)， 如 图 4-17 所 示 。 


margin-top 


border-top 


j 


Hal- mameur 
ML- 


border-bottom 


margin-bottom 


图 4-17 盒子 模型 


理解 盒子 模型 就 可 以 理解 层 与 层 之 间 定 位 的 关系 以 及 层 内 部 的 表达 样式 。 其 中 margin 
属性 负责 层 与 层 之 间 的 距离 ，padding 属性 负责 内 容 和 边框 之 间 的 距离 。 
下 面 的 代码 定义 了 盒子 模型 中 的 一 些 样式 。 
<style> 
#sample 
ú 
background-color: #FFCC00; 
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border-style: solid; 
padding-bottom: 25px; 
margin-bottom: 40px; 
width: 80%; 
} 
</style> 
2. 层 的 定位 
在 一 个 页 面 中 定义 多 个 层 ， 会 发 现 这 些 层 自动 排列 在 不 同 的 行 ， 而 要 真正 实现 左右 排 
列 ， 就 要 加 入 新 的 属性 一 一 float( 浮 动 属性 )。float 浮动 属性 是 DIV 和 CSS 布局 中 的 一 个 非 
常 重要 的 属性 。 大 部 分 的 DIV 布局 都 是 通过 float 的 控制 来 实现 的 。 具 体 参 数 如 下 。 
e float:none 用 于 设置 是 否 浮 动 。 
o float:left 用 于 表示 对 象 向 左 浮动 。 
o float:right 用 于 表示 对 象 向 右 浮动 。 
例 4-6: 利用 层 ， 创 建 一 种 左右 上 下 分 栏 的 样式 。 
(1) 启动 VWD 2010, 打开 网 站 Chapter4， 通 过 “添加 新 项 ”对 话 框 在 该 网 站 中 添加 一 
个 名 为 div.aspx 的 Web 窗 体 页 。 
(2) 修改 页 面 <head> 和 <body> 内 的 代码 如 下 所 示 : 


<head runat="server"> 
<style> 
#left #right {background-color:#eeeeee;border: 1px solid #33ccff-height:200px; } 
#left{width:180px; float:left; } 
#bottom{ background-color:#eeeeee; border:1px solid #33ccff, height:50px; clear:both; } 
</style> 
</head> 
<body> 
<form id="form1" runat="server"> 
<div id="left"> 当 前 层 的 了 D 是 left</div> 
<div id='right"> 当 前 层 的 ID 是 right</div> 
<div id="bottom"> 当 前 层 的 ID 是 bottom</div> 
</form> 
</body> 


(3) 切换 到 “设计 ”视图 ， 其 效果 如 图 4-18 所 示 。 


lbody| 
当前 层 的 了 D 是 left 当前 层 的 ID 是 right 


当前 层 的 ID 是 bottom 


图 4-18 左右 上 下 分 栏 
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3. 利用 DIV 和 CSS 实现 页 面 布局 

DIV 只 是 一 个 区 域 标识 ， 划 定 了 一 个 区 域 ， 要 实现 样式 还 需要 借助 于 CSS， 这 样 的 分 
离 ， 使 得 DIV 的 最 终 效 果 是 由 CSS 来 编写 的 。CSS 可 以 实现 左右 分 栏 ， 也 可 以 实现 上 下 
分 栏 ， 而 表格 则 没有 这 么 大 的 灵活 性 。CSS 与 DIV 的 无 关 性 ， 决 定 了 DIV 在 设计 上 有 极 
大 的 伸缩 性 ， 而 不 会 被 单元 格 固定 的 模式 束缚 。 因 此 ， 实 现 网 页 布局 ， 通 常 是 先 在 网 页 中 
将 内 容 用 DIV 标记 出 来 ， 然 后 再 用 CSS 来 编写 样式 。 
采用 DIV 和 CSS 布局 之 前 ， 首 先 要 分 析 网 页 有 哪些 内 容 块 ， 以 及 每 个 内 容 块 的 含义 
这 就 是 所 谓 的 网 页 结构 。 通 常情 况 下 ， 页 面 结 构 包 含 以 下 几 块 。 

(1) 标题 区 (headeD: 用 来 显示 网 站 的 标志 和 站 点 名 称 等 。 

(2) 导航 区 (navigation): 用 来 表示 网 页 的 结构 关系 ， 如 站 点 导航 ， 通 常 放置 主 菜单 。 

(3) 主 功 能 区 (content): 用 来 显示 网 站 的 主题 内 容 ， 如 商品 展示 和 公司 介绍 等 。 

(4) 页 脚 (footer): 用 来 显示 网 站 的 版 权 和 有 关 法 律 声明 等 。 

通常 采用 DIV 元 素来 将 这 些 结构 先 定义 出 来 ， 类 似 这 样 : 


xi 


<div id="header"></div> 
<div id="globalnav"></div> 
<div id="content"></div> 
<div id="footer"></div> 


然后 在 CSS 样式 表 中 定义 每 个 元 素 ID 的 具体 样式 ， 从 而 控制 整个 页 面 的 布局 。 例 如 ， 
主 功能 区 ID 选择 符 的 定义 如 下 : 
#content 


Í 
width: 740px; 
margin-top: 0px; 
margin-left:auto; 
margin-right:auto; 


44 主题 


学 习 了 利用 CSS 控制 页 面 上 各 元 素 的 样式 以 及 部 分 服务 器 控件 的 样式 , 但 是 有 些 服务 
器 控件 的 属性 无 法 通过 css 进行 控制 。 为 了 解决 这 个 问题 ， 从 ASP.NET 2.0 开始 就 提供 了 
一 种 称 为 “主题 ”的 新 方式 ， 它 可 以 保持 网 站 外 观 的 一 致 性 和 独立 性 ， 同 时 使 页 面 的 样式 
控制 更 加 灵活 方便 ， 如 动态 实现 不 同 用 户 界面 的 切换 等 。 


441 主题 概述 


主题 是 定义 页 面 和 控件 外 观 的 文件 的 集合 。 它 通常 包含 外 观 文件 (扩展 名 为 .skin)、 级 
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联 样式 表 文件 (扩展 名 为 .css)、 图 片 和 其 他 资源 等 的 组 合 ,但 一 个 主题 至 少 包含 一 个 外 观 文件 。 
主题 在 Web 站 点 的 根 文件 夹 中 的 特殊 文件 夹 App_Themes 中 定义 。 在 这 个 文件 夹 中 需 
要 创建 定义 实际 主题 的 一 个 或 多 个 子 文件 来。 在 每 个 子 文件 夹 中 ， 可 以 有 若干 组 成 主题 的 
文件 。 如 图 4-19 所 示 的 主题 目录 结构 中 创建 了 3 个 主题 ， 分 别 是 “主题 1”、“ 主 题 2” 
和 “主题 3”， “主题 1” 中 包含 1 个 外 观 文件 ， “主题 2” 中 包含 2 个 外 观 文件 ， “主题 
3” 中 包含 1 个 外 观 文件 和 1 个 样式 表 文 件 。 


A) StyleSheet. css 
图 4-19 主题 目录 结构 


1. 主题 的 类 型 
主题 分 为 两 大 类 型 ， 一 类 是 应 用 程序 主题 ， 另 一 类 是 全 局 主题 。 
e 应 用 程序 主题 是 指 保存 在 Web 应 用 程序 的 App_Themes 文件 夹 下 的 一 个 或 多 个 主 
题 文件 夹 ， 主 题 的 名 称 就 是 文件 夹 的 名 称 。 
° 全 局 主题 是 指 保存 在 服务 器 上 , 根据 不 同 的 服务 器 配置 决定 的 , 能 够 对 服务 器 上 所 
有 Web 应 用 程序 起 作用 的 主题 文件 夹 。 
一 般 情况 下 ， 很 少 用 到 全 局 主题 ， 而 本 书 所 讲 的 主题 也 仅 指 应 用 程序 主题 ， 即 保存 在 
应 用 程序 中 App_Themes 文件 夹 下 的 主题 文件 夹 ， 简 称 主题 。 
ASP.NET 页 面 有 两 个 不 同 的 设置 主题 的 属性 ,Theme( 页 主题 ) 属 性 和 StyleSheetTheme( 页 
的 样式 表 主 题 ) 属 性 。 这 两 个 属性 都 使 用 在 App_Themes 文件 夹 中 定义 的 主题 。 虽然 一 开始 
它们 看 起 来 非常 相似 ， 但 是 ， 在 运行 时 它们 的 行为 就 不 同 了 。StyleSheetThemes 在 页 面 的 
生命 周期 中 应 用 得 非常 旱 ， 在 创建 页 面 实例 后 不 久 就 应 用 了 。 这 意味 着 单个 页 面 能 通过 在 
控件 上 应 用 内 联 届 性 来 重 写 主题 的 设置 。 例 如 ， 带 有 将 按钮 的 BackColor 设置 为 紫色 的 外 
观 文件 的 主题 可 以 被 页 面 中 下 面 的 控件 声明 重 写 : 


<asp:Button ID="Button1" runat="server" Text="Button" BackColor="Blue" /> 


而 Theme 属性 在 页 面 的 生命 周期 中 应 用 的 时 间 较 晚 , 能 有 效 地 重 写 为 单个 控件 自 定义 
的 任何 属性 。 

由 于 StyleSheetTheme 的 属性 能 被 页 面 重 写 ， 而 Theme 又 能 再 次 重 写 这 些 属性 ， 两 者 
于 不 同 的 目的 。 如 果 想 为 控件 提供 默认 设置 则 应 该 设置 StyleSheetTheme 属性 ， 即 
StyleSheetTheme 能 为 控件 提供 默认 值 ， 然 后 又 可 以 在 页 面 级 重 写 。 如 果 想 强制 应 用 控件 的 
外 观 则 应 使 用 Theme 属性 ， 因 为 Theme 中 的 设置 不 能 再 重 写 ， 而 且 它 有 效 地 重 写 了 任何 
自 定义 设置 ， 因 此 能 确保 控件 的 外 观 就 是 在 主题 中 定义 的 样子 。 

如 果 由 于 某 种 原因 不 想 向 特定 控件 应 用 外 观 ， 可 以 通过 设置 控件 的 属性 


xem 
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EnableTheming 来 禁用 外 观 ， 如 下 所 示 : 


<asp:Button ID="Button1" runat="server" EnableTheming="False" Text="Button" /> 


由 于 EnableTheming 被 设置 为 False， 因 此 就 不 会 向 控件 应 用 外 观 。 而 仍然 会 应 用 主题 
的 CSS 文件 中 的 CSS 设置 。 
2. 外 观 文件 


外 观 文件 是 主题 的 核心 文件 ， 也 称 为 皮肤 文件 ， 专 门 用 于 定义 服务 器 控件 的 外 观 。 在 
主题 中 可 以 包含 一 个 或 多 个 外 观 文件 ， 外 观 文件 的 后 级 名 为 .skin。 

在 控件 外 观 设置 中 ， 只 能 包含 主题 的 属性 定义 ， 如 样式 属性 、 模 板 属性 和 数据 绑 定 表 
达 式 等 ， 不 能 包含 控件 的 一， 如 Label 控件 的 外 观 设置 代码 如 下 : 


<asp:Label runat="server" BackColor="Blue" Font-Names="Arial Narrow" /> 


这 样 ,一 旦 将 该 外 观 应 用 到 Web 页 面 中 ,所 有 的 Label 控件 都 将 显示 外 观 所 设置 的 样式 。 

右 击 某 一 个 “主题 ”文件 夹 ， 从 弹出 的 快捷 菜单 中 选择 “添加 新 项 ”命令 ， 在 弹出 的 
“添加 新 项 ”对 话 框 中 选择 “外 观 文件 ”选项 ， 即 可 添加 一 个 外 观 文件 。 

3. 级 联 样式 表 文 件 

主题 中 可 以 包含 一 个 或 多 个 CSS 文件 ， 一 旦 CSS 文件 被 放 在 主题 中 ， 则 应 用 时 无 须 
再 在 页 面 中 指定 CSS 文件 链接 ， 而 是 通过 设置 页 面 或 网 站 所 使 用 的 主题 即 可 ， 当 主题 得 到 
应 用 时 ， 主 题 中 的 CSS 文件 会 自动 应 用 到 页 面 中 。 

右 击 某 一 个 “主题 ”文件 夹 ， 从 弹出 的 快捷 菜单 中 选择 “添加 新 项 ”命令 ， 在 弹出 的 
“添加 新 项 ”对 话 框 中 选择 “样式 表 文件 ”选项 ， 即 可 添加 样式 表 文件 。 
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要 创建 一 个 主题 ， 需 要 做 下 列 事情 。 

o 如 果 站 点 中 还 没有 App_Themes 文件 夹 ， 则 首先 要 创建 该 文件 夹 。 

e° 对 于 要 创建 的 每 个 主题 ， 用 主题 的 名 称 创建 一 个 子 文件 夹 。 

e 可 选 地 ， 创 建 一 个 或 多 个 将 成 为 主题 一 部 分 的 CSS 文件 。 虽 然 根 据 主题 命名 css 
文件 有 助 于 标识 正确 的 文件 , 但 并 不 要 求 一 定 要 这 样 做 。 添加 到 主题 的 文件 夹 中 的 
任何 CSS 文件 都 会 在 运行 时 自动 添加 到 页 面 中 。 

e 可 选 地 , 向 主题 文件 夹 中 添加 一 个 或 多 个 图 像 。CSS 文件 应 当 用 稍 后 将 介绍 的 相对 
路 径 来 引用 这 些 图 像 。 

e 可 选 地 , 向 主题 文件 夹 中 添加 一 个 或 多 个 外 观 文件 。 外 观 允许 为 之 后 要 在 运行 时 应 
的 特定 控件 定义 单个 属性 (如 ForeColor 和 BackColon)。 

执行 了 这 些 步骤 以 后 ， 就 能 将 站 点 或 单个 Web 页 面 配置 为 使 用 此 主题 。 
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技巧 : 

如 果 站 点 中 没有 App Themes 文件 夹 ， 可 以 在 “解决 方案 资源 管理 器 ”中 ， 右 击 项 目 
名 ， 从 弹出 的 快捷 菜单 中 选择 “添加 ”|“ 添 加 ASPNET 文件 夹 ”| “主题 ”命令 ,创建 
App Themes 文件 夹 ， 并 在 该 文件 夹 下 生成 一 个 默认 名 为 “主题 1” 的 文件 夹 。 

1. 在 主题 中 定义 外 观 

skin 文件 必须 直接 在 主题 的 文件 夹 中 创建 。 不 能 像 存储 主题 的 图 像 那样 把 它们 存储 在 
一 丰 手 交 件 夹 中 。 

在 外 观 文件 中 ， 系 统 没有 提供 控件 属性 设置 的 智能 提示 功能 ， 这 使 得 定义 自己 的 控件 
及 其 属性 比较 困难 。 如 果 要 使 用 VWD 的 智能 提示 功能 ， 可 做 如 下 设置 。 

(1) 选择 “工具 ”|“ 选 项 ”命令 ， 打 开 “ 选 项 ”对 话 框 。 

(2) 展开 “文本 编辑 器 ”选项 ， 然 后 选择 “文件 扩展 名 ”。 

(3) 在 右 侧 的 “扩展 名 ”文本 框 中 输入 skin， 然 后 从 “编辑 器 ”下 拉 列 表 中 选择 “用 
户 控件 编辑 器 ”选项 。 

(4) 单 击 “ 添 加 ”按钮 ， 然 后 单 击 “ 确 定 ” 按 钮 完成 设置 ， 如 图 4-20 所 示 。 

设置 完 以 后 ， 当 再 次 打开 一 个 skin 文件 时 ， 就 会 出 现 智 能 提示 功能 了 。 
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图 4-20 “选项 ”对 话 框 


例 4-7: 创建 一 个 包含 一 些 简单 外 观 的 主题 ， 这 些 外 观 用 于 定义 控件 的 外 观 。 

(1) 启动 VWD 2010， 打 开 网 站 Chapter4 。 

(2) 在 “解决 方案 资源 管理 器 ”中 ， 右 击 项 目 名 程 ， 从 弹出 的 快捷 菜单 中 选择 “添加 ”| 
“添加 ASP.NET 文件 夹 ”|“ 主 题 ” 命 令 ， 系 统 将 创建 名 为 App_Themes 的 文件 夹 和 名 为 
“主题 1” 的 子 文件 夹 。 

(3) 右 击 “主题 1” 文 件 夹 ， 从 弹出 的 快捷 菜单 中 选择 “添加 新 项 ”命令 , 添加 一 个 新 
的 外 观 文件 SkinFile.skin。 

(4) 新 添加 的 文件 中 包括 一 段 外 观 文件 编写 的 说 明文 字 和 两 个 示例 ， 如 下 所 示 : 

<%-- 
默认 的 外 观 模板 。 以 下 外 观 仅 作为 示例 提供 。 


1. 命名 的 控件 外 观 。SkinId 的 定义 应 唯一 ， 因 为 在 同一 主题 中 不 允许 一 个 控件 类 型 有 重复 的 
SkinId。 
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<asp:GridView runat="server" SkinId="gridviewSkin" BackColor=" White" > 
<AlternatingRowStyle BackColor="Blue" /> 

</asp:GridView> 

2. 默认 外 观 。 未 定义 SkinId。 在 同一 主题 中 每 个 控件 类 型 只 允许 有 一 个 默认 的 控件 外 观 。 

<asp:Image runat="server" ImageUrl="~/images/image1.jpg" /> 

--%> 


(5) 按照 以 上 示例 ， 添 加 如 下 代码 ， 定 义 Label 和 Button 控件 的 外 观 。 


<asp:Label runat="server" ForeColor="red" Font-Size="14pt" Font-Bold="true" /> 
<asp:Button runat="server" Borderstyle="Solid" Borderwidth="2px" Bordercolor="Blue" 


Backcolor="yellow"/> 
(6) 保存 该 外 观 文件 。 通 过 “添加 新 项 ”对 话 框 添加 一 个 名 为 ThemeTest.aspx 的 网 页 ， 
切换 到 “设计 ”视图 ， 添 加 1 个 Label 控件 和 1 个 Button 控件 。 
(7) 在 “属性 ”面板 中 选择 Document 元 素 , 设置 Theme 属性 为 “主题 1”, 切换 到 “ 源 ” 
视图 中 ， 会 发 现代 码 第 1 行 的 @ Page 指令 中 添加 了 下 面 的 属性 : 
<%@ Page .… Theme=" 主 题 1"%> 


(8) 编译 并 运行 程序 ,在 默认 浏览 器 中 打开 该 页 面 ， 查看 控件 的 效果 ,如 图 4-21 所 示 。 
2. 使 用 SkinID 属性 


如 果 希 望 某 些 控 件 的 外 观 和 页 面 中 具有 相同 类 型 的 其 他 控件 的 外 观 不 一 样 ， 则 可 以 
在 .skin 文件 中 给 特定 的 控件 添加 一 个 SkinID 属性 ， 来 看 下 面 的 例子 。 

例 4-8: 在 例 4-7 的 基础 上 增加 一 个 按钮 控件 的 外 观 定 义 并 指定 SkinID 属性 ， 然 后 在 
测试 页 面 中 应 用 该 特定 外 观 。 

(1) 启动 VWD 2010， 打 开 网 站 Chapter4。 

(2) 打开 外 观 文件 SkinFile.skin。 

G) 添加 一 个 按钮 的 外 观 定义 ， 并 为 其 设置 SkinID 属性 ， 如 下 所 示 : 

<asp:Button runat="server" SkinID="GreenBtn" Font-Size="14pt" Borderstyle="dotted" 
Borderwidth="2px" Bordercolor="red" Backcolor="Green"/> 


(4) 在 ThemeTest.aspx 页 面 中 在 添加 另 一 个 Button 控件 , 设置 新 添加 的 Button 控件 的 
SkinID 属性 为 GreenBtn。 显 示 效 果 如 图 4-22 所 示 。 


R z i " 
Æ http://localhost:1136/Chapter4/Them... -OE Æ http://1ocalhost:1136/Chapter4/ Them... |- (OEI 
gə- e localhost x] gə- e localhost [x] 
XEO RBO FEV BARW IAW BHW 文件 四 ”编辑 中 SEV KERA IAW HHW 
RER Æ htp://localhost:11. a-a- ARER Æ htp://localhost:11... ü- a- ` 
@ Internet far 100 ~ @ Internet far Rios ~ 


图 4-21 应 用 外 观 后 的 控件 图 4-22 应 用 SkinID 属性 的 控件 
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3. 在 主题 中 定义 样式 表 


除了 外 观 文件 ,在 主题 中 还 可 以 定义 .css 文件 .然后 在 网 页 文件 中 设置 StyleSheetTheme 
属性 为 定义 的 主题 即 可 。 

例 4-9: 在 网 页 文件 中 同时 使 用 外 观 文件 和 样式 表 文 件 。 

(1) 启动 VWD 2010， 打 开 网 站 Chapter4 。 

(2) 右 击 “ 主 题 1” 文 件 夹 ， 从 弹出 的 快捷 菜单 中 选择 “添加 新 项 ”命令 ,添加 一 个 样 
式 表 文件 StyleSheetl.css。 

(3) 在 StyleSheetl.css 样式 文件 中 添加 如 下 代码 ， 定 义 h2 的 样式 : 


h2 

H 
border-style: dashed; 
font-size: 1.5em; 
padding-bottom: 0px; 
margin-bottom: 2px; 
color: #FF00CC; 

) 


(4) 在 ThemeTest.aspx 页 面 中 添加 如 下 <h2> 标 记 的 元 素 。 
<h2> 欢 迎 光 临 金 百合 拉丁 舞 培 训 学 校 网 站 </h2> 


(5) 修改 当前 页 面 的 Document 中 属性 StyleSheetTheme 的 值 为 “主题 1 
(6) 编译 并 运行 程序 ,在 浏览 器 中 即 可 看 到 引入 外 观 和 样式 表 文 件 后 的 最 终 显 显示 效果 ， 
如 图 4-23 所 示 。 


Æ http://localhost: 1136/Chapter4/ThemeTest.a... m [=] [X] 
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图 4-23 引入 外 观 和 样式 后 的 页 面 效果 


443 ”主题 的 应 用 级 别 


创建 了 主题 之 后 ， 可 以 定制 如 何在 应 用 程序 中 使 用 主题 ， 方 法 是 将 主题 作为 自 定义 主 
题 与 网 页 文件 关联 ， 或 者 将 主题 作为 样式 表 主 题 与 网 页 文件 关联 。 样 式 表 主题 和 自 定义 主 
题 都 使 用 相同 的 主题 文件 ， 但 是 样式 表 主 题 在 网 页 文件 的 控件 和 属性 中 的 优先 级 最 低 。 在 
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ASP.NET 中 ， 主 题 的 优先 级 顺序 如 下 。 

(1) 主题 设置 ， 包 括 Web.config 文件 中 设置 的 主题 。 

(2) 本 地 网 页 文件 的 样式 属性 设置 。 

(3) 样式 表 主 题 设置 。 

在 这 里 ， 如 果 选 择 使 用 样式 表 主 题 ， 则 在 网 页 文件 中 本 地 声明 的 任何 样式 信息 都 将 履 
盖 样 式 表 主题 的 属性 。 同 样 ， 如 果 使 用 自 定义 主题 ， 则 主题 的 属性 将 覆盖 本 地 网 页 文件 中 
设置 的 任何 样式 内 容 ， 以 及 任何 样式 表 主 题 中 的 任何 内 容 。 

有 3 个 不 同 的 选项 可 以 向 Web 站 点 应 用 主题 ， 分 别 是 : 在 Page 指令 中 的 页 面 级 、 在 
站 点 级 修改 web.config 文件 、 通 过 程序 来 设置 主题 。 

1. 在 页 面 级 设置 主题 


前 面 的 例 4-7 和 例 4-8 中 就 是 使 用 这 种 方式 来 应 用 主题 的 。 在 页 面 级 设置 Theme 属性 
或 StyleSheetTheme 属性 很 容易 ， 只 需 设置 页 面 的 Page 指令 中 的 相关 属性 即 可 。 


<%@ Page Language="C#" AutoEventWireup="false" CodeFile="Default.aspx.cs" 
Inherits=" Default" Theme=" 主 题 1" StyleSheetTheme=" 主 题 1" %> 


注意 : 
用 StyleSheetTheme 替换 Theme 来 应 用 一 个 主题 , 该 主题 的 设置 可 以 由 单个 页 面 重 写 。 
2. 在 站 点 级 设置 主题 
如 果 要 在 整个 Web 站 点 中 强制 应 用 同一 个 主题 ， 可 以 在 web.config 文件 中 设置 主题 。 
要 做 到 这 一 点 ， 需 要 将 一 个 theme 属性 添加 到 <system.web> 元 素 内 的 <pages> 元 素 中 。 
<pages theme=" 主 题 1"> 
P 
提示 : 
确保 全 部 用 小 写字 母 输 入 theme， 因 为 web.config 文件 中 的 XML 是 区 分 大 小 写 的 。 
3. 通过 程序 来 设置 主题 
设置 主题 的 第 三 种 也 是 最 后 一 种 方式 是 通过 代码 来 编程 设置 的 。 由 于 主题 的 工作 方 
式 ， 需 要 在 页 面 生命 周 期 的 早期 完成 这 一 工作 。 通 常 是 在 Prelnit 事件 中 ， 通 过 Page 对 象 
的 Theme 属性 来 设置 主题 。 


444 扩展 主题 


除了 css 文件 与 外 观 以 外 ， 主 题 还 可 以 包含 图 像 。 主 题 图 像 最 普遍 的 用 法 是 从 css 
中 引用 它们 。 要 充分 利用 图 像 ， 就 要 了 解 CSS 如 何 引用 图 像 。 
例 4-10: 向 主题 中 添加 图 像 。 
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(1) 启动 VWD 2010， 打 开 网 站 Chapter4。 

(2) 右 击 “ 主 题 1” 文 件 夹 ， 从 弹出 的 快捷 菜单 中 选择 “新 建文 件 夹 ” 命 令 ， 新 建 一 个 
文件 夹 ， 修 改 其 名 称 为 images, fÉ images 文件 夹 上 右 击 ， 选 择 “ 添 加 现 有 项 ”命令 ， 添 加 
一 个 图 片 bgjpg 作为 主题 1 的 背景 图 片 。 

G) 为 了 引用 bgjpg 文件 ， 可 以 向 StyleSheetl.css 中 添加 如 下 css 样式 。 


body 
í 

background-image: url(images/bg.jpg); 
j 


(4) 此 时 在 浏览 器 中 打开 ThemeTest.aspx 页 面 , 可 以 看 到 含有 背景 图 片 的 Web 页 面 了 ， 
如 图 4-24 所 示 。 


Rl) 
© localhost Mx 
HEV BRAW IAV Wq 
s 全 "加 


图 4-24 主题 中 包含 背景 图 片 的 效果 


说 明 : 
在 设计 时 ， 除 非 给 出 一 个 以 指示 站 点 根 文件 夹 的 正人 儿 杠 (/) 开 头 的 路 径 ， 否则 CSS 选择 


器 引用 的 图 像 会 相对 于 CSS 文件 的 当前 位 置 搜索 。 


445 动态 切换 主题 


动态 切换 主题 是 指 在 运行 时 切换 主题 。 例 如 ， 可 以 允许 用 户 用 喜欢 的 颜色 和 布局 选择 
主题 。 由 于 使 用 的 是 在 运行 时 向 页 面 应 用 主题 的 方式 ， 因 此 需要 在 页 面 的 生命 周期 较 早 的 
时 候 设 置 主题 ， 即 在 PreInit 事件 中 设置 。 

为 了 人 允许 用 户 修改 主题 ， 可 以 提供 给 他 们 一 个 下 拉 菜 单 ， 当 用 户 修 改 列 表 中 的 活动 选 
项 时 ， 该 菜单 自动 向 服务 器 发 起 回 发 请 求 。 在 服务 器 端 ， 就 会 得 到 从 列表 中 选择 的 主题 ， 
将 它 应 用 到 页 面 上 ， 然 后 将 选项 存储 在 cookie 中 ， 以 便 下 次 访问 时 检索 它 。 

例 4-11: 让 用 户 选择 自己 喜欢 的 主题 ， 实 现 动 态 换 肤 功能 。 

(1) 启动 VWD 2010， 打 开 网 站 Chapter4。 
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(2) 右 击 “主题 1” 文 件 夹 ， 从 弹出 的 快捷 菜单 中 选择 “复制 ”命令 ， 然 后 再 次 右 训 
选择 “粘贴 ”命令 ， 得 到 “副本 主题 1”， 通 过 “ 重 命名 ”命令 将 其 命名 为 “主题 2”。 

(3) 用 同样 的 方法 ， 再 复制 一 份 主题 ， 并 将 复制 后 的 主题 命名 为 “主题 3”。 

(4) “主题 2” 定 义 为 “浪漫 小 屋 ”， 所 以 背景 图 片 和 控件 的 外 观 都 以 粉色 和 橘 黄色 为 
主 ， 修 改 主题 2 中 的 外 观 文件 SkinFile.skin， 添 加 如 下 代码 : 


ET 


<asp:Label runat="server" BackColor="Fuchsia" BorderColor="White" Borderstyle="dotted" 
Font-Bold="True" Font-Size="Larger" ForeColor="Blue"></asp:Label> 
<asp:DropDownList runat="server" BackColor="#FFFF99" 
Font-Bold="True" Font-Size="Large" ForeColor="#FF0066"></asp:DropDownList> 
<asp:Calendar runat="server" BackColor="#FFFFCC" 
BorderColor="#FFCC66" BorderWidth="1px" DayNameFormat="Shortest" 
Font-Names="Verdana" Font-Size="8pt" ForeColor="#663399" Height="200px" 
ShowGridLines="True" Width="220px"> 
<DayHeaderStyle BackColor="#FFCC66" Font-Bold="True" Height="1px" /> 
<NextPrevStyle Font-Size="9pt" ForeColor="#FFFFCC" /> 
<OtherMonthDayStyle ForeColor="#CC9966" /> 
<SelectedDayStyle BackColor="#CCCCFF" Font-Bold="True" /> 
<SelectorStyle BackColor="#FFCC66" /> 
<TitleStyle BackColor="#990000" Font-Bold="True" Font-Size="9pt" 
ForeColor="#FFFFCC" /> 
<TodayDayStyle BackColor="#FFCC66" ForeColor="White" /> 
</asp:Calendar> 


说 明 : 

为 了 让 用 户 可 以 动态 地 切换 主题 ， 会 在 测试 页 面 中 添加 DropDownList 控件 ， 所 以 上 
述 外 观 文件 中 定义 了 DropDownList 控件 的 外 观 样式 。 另 外 ， 还 定义 了 Calendar 控件 的 外 
观 ， 这 个 主要 用 来 显示 不 同 的 效果 ， 以 区 分 不 同 的 主题 。 


(5) 主题 2 样式 表 文 件 中 只 定义 背景 图 片 ， 无 须 修改 ， 只 须 蔡 换 一 下 图 片 即 可 。 
(6)“ 主 题 3” 定义 为 “鸟语花香 ”, 所 以 背景 图 片 和 控件 的 外 观 都 以 青春 和 绿色 为 主 ， 
在 主题 3 的 外 观 文件 中 添加 如 下 代码 : 


<asp:Label runat="server" BackColor="#FFFF66" ForeColor="#0066FF" Font-Bold="True" 
Font-Size="Large" BorderStyle="Groove" /> 
<asp:DropDownList runat="server" Font-Bold="True" 
BackColor="#FFFFCC" ForeColor="Lime" Font-Size="Large"/> 
<asp:Calendar runat="server" BackColor="White" 
BorderColor="#66FF33" BorderWidth="1px" CellPadding="1" 
DayNameFormat="Shortest" Font-Names="Verdana" Font-Size="8pt" 
ForeColor="#003399" Height="200px" Width="220px"> 
<DayHeaderStyle BackColor="#99FF33" ForeColor="#99FF66" Height=" 1px" /> 
<NextPrevStyle Font-Size="8pt" ForeColor="#CCCCFF" /> 
<OtherMonthDayStyle ForeColor="#999999" /> 
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<SelectedDayStyle BackColor="#009999" Font-Bold= "True" ForeColor="#CCFF99" /> 
<SelectorStyle BackColor="#99CCCC" ForeColor="#336666" /> 
<TitleStyle BackColor="#009900" BorderColor="#3366CC" BorderWidth=" 1px" 
Font-Bold="True" Font-Size="10pt" ForeColor="#CCCCFF" Height="25px" /> 
<TodayDayStyle BackColor="#99CCCC" ForeColor="White" /> 
<WeekendDayStyle BackColor="#66FF66" /> 
</asp:Calendar> 


(7) 主题 3 的 样式 表 文 件 中 也 只 需 替 换 一 下 背景 图 片 即 可 。 

(8) 通过 “添加 新 项 ”对 话 框 添加 一 个 名 为 ThemeTest2.aspx 的 测试 页 面 ， 切 换 到 “ 设 
计 ” 视 图 ， 添 加 一 个 Label 控件 、 一 个 DropDownList 控件 和 一 个 Calendar 控件 。 

(9) 设置 Label 控件 的 Text 属性 为 “请 选择 主题 : ”， 为 DropDownList 控件 的 Items 
属性 添加 几 个 选择 ， 设 置 AutoPostBack 属性 为 True， 生 成 的 代码 如 下 : 


<asp:Label ID="Labell" runat="server" Text=" 请 选择 主题 : "></asp:Label> 
<asp:DropDownList ID="DropDownListl" runat="server" AutoPostBack="True"> 

<asp:ListItem Value=" 主 题 1"> 默 认 主题 </asp:ListItem> 

<asp:ListItem Value=" 主 题 2"> 浪 漫 小 屋 </asp:ListItem> 

<asp:ListItem Value=" 主 题 3"> 鸟 语 花 香 </asp:ListItem> 
</asp:DropDownList> 


(10) 为 DropDownList 控件 添加 SelectedIndexChanged 事件 处 理 程序 ， 代 码 如 下 : 


protected void DropDownList1_SelectedIndexChanged(object sender, EventArgs e) 

{ 
HttpCookie myTheme = new HttpCookie("userTheme"); 
myTheme.Expires = DateTime.Now.AddMonths(3); 
myTheme. Value = DropDownList1.SelectedValue; 
Response.Cookies.Add(my Theme); 
Response.Redirect(Request.Url.ToStringO); 

} 


(11) 当 页 面 加 载 时 将 需要 再 次 从 列表 中 预先 选择 恰当 的 项 ， 以 显示 正确 的 主题 。 进 行 
此 操作 的 最 佳 位 置 是 在 Page 类 的 Load 事件 中 。 添 加 处 理 程序 的 代码 如 下 : 


protected void Page Load(object sender, EventArgs e) 
Í 
if (!Page.IsPostBack) 
Í 
string selectedTheme = Page. Theme; 
HttpCookie myTheme = Request.Cookies.Get("userTheme"); 
1f (myTheme != null) 
í 
selectedTheme = myTheme. Value; 


第 4 章 页 面 设计 与 布局 "135。 


if ('string.IsNullOrEmpty(selectedTheme) && 
DropDownListl.Items.FindByValue(selectedTheme) != null) 
d 
DropDownListl.Items.FindByValue(selectedTheme).Selected = true; 
J 


) 


(12) 正如 前 面 所 提 到 的 ， 主 题 需要 在 PreInit 事件 (该 事件 在 页 面 生命 周期 的 早期 发 生 ) 
中 设置 。 在 该 事件 内 可 以 查看 带 选 中 主题 的 cookie 是 否 存在 。 如 果 存 在 ， 就 可 以 用 它 的 值 
设置 恰当 的 主题 ， 代 码 如 下 : 


protected void Page Prelnit(object sender, EventArgs e) 


{ 
HttpCookie preferredTheme = Request.Cookies.Get("userTheme"); 
if (preferredTheme != null) 
{ 
Page. Theme = preferredTheme. Value; 
5 
else 
{ 
Page.Theme = "主题 2":// 默 认 使 用 主题 2 
} 
} 


(13) 编译 并 运行 程序 ， 在 浏览 器 中 打开 ThemeTest2.aspx 页 面 ， 通 过 下 拉 列 表 选 择 不 
同 的 主题 ， 再 效果 如 图 4-25 所 示 。 


技巧 : 
在 外 观 文件 中 定义 控件 的 外 观 时 ， 可 以 在 普通 页 面 中 添加 一 个 要 设置 外 观 的 控件 ， 在 
“设计 ”视图 中 通过 “属性 ”面板 对 其 进行 格式 化 设置 ， 然 后 将 生成 的 代码 复制 到 .skin x 
件 中 ， 再 删除 ID 属性 即 可 。 
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= | 
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图 4-25 动态 切换 主题 效果 
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45 母 版 页 


在 构建 Web 站 点 时 ,应 该 使 布局 和 行为 尽 可 能 保持 一 致 。 而 且 有 很 多 元 素 会 出 现在 每 
一 个 页 面 中 ， 如 站 点 标题 、 公 共 导 航 以 及 版 权 信息 等 ， 这 些 元 素 的 一 致 布局 会 让 用 户 知道 
自己 始终 是 在 同一 个 站 点 中 。 虽 然 这 些 元 素 可 以 通过 在 XHTML 中 使 用 包含 文件 来 构建 ， 
但 ASP.NET 4 和 VWD 2010 提供 了 更 加 健壮 的 母 版 页 技术 来 实现 。 

母 版 页 的 最 大 好 处 是 可 以 在 单个 地 方 定 义 站 点 中 所 有 页 面 的 全 局 外 观 。 这 样 ， 当 需要 
修改 站 点 的 布局 (如 要 把 菜单 从 左边 移 到 右边 ) 时 ， 只 需 修 改 母 版 页 ， 基 于 此 类 母 版 页 的 页 
面 就 会 自动 进行 相应 的 修改 。 
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母 版 页 是 用 于 设置 页 面 外 观 的 模板 ， 是 一 种 特殊 的 ASP.NET 网 页 文件 ， 同 样 也 具有 
其 他 ASP.NET 文件 的 功能 ， 如 添加 控件 、 设 置 样式 等 ， 只 不 过 它 的 扩展 名 是 .master。 在 母 
版 页 中 ， 界 面 被 分 为 公用 区 和 可 编辑 区 ， 公 用 区 的 设计 方法 与 一 般 页 面 的 设计 方式 相同 ， 
可 编辑 区 则 用 ContentPlaceHolder 控件 预 留 出 来 。 

引用 母 版 页 的 .aspx 页 面 称 为 内 容 页 ， 在 内 容 页 中 ， 母 版 页 的 ContentPlaceHolder 控件 
预 留 的 可 编辑 区 会 被 自动 替换 为 Content 控件 , FRA RRE Content 控件 区 域 中 填充 内 
容 即 可 ， 在 母 版 页 中 定义 的 其 他 标记 将 自动 出 现在 引用 该 母 版 页 的 内 容 页 中 ， 母 版 页 的 部 
分 以 灰色 显示 ， 表 示 不 能 编辑 这 些 内 容 。 

基于 一 个 母 版 页 可 以 创建 一 个 或 多 个 内 容 页 ， 使 用 母 版 页 可 以 统一 管理 和 定义 具有 相 
同 布局 风格 的 页 面 ， 给 网 页 设计 和 修改 带 来 极 大 的 方便 。 使 用 母 版 页 具有 如 下 优点 。 

o 使 用 母 版 页 可 以 集中 处 理 页 的 通用 功能 ， 以 便 可 以 只 在 一 个 位 置 进行 更 新 。 

e 使 用 母 版 页 可 以 方便 地 创建 一 组 控件 和 代码 ， 并 将 结果 应 用 于 一 组 新 的 页 面 。 

o 通过 允许 控制 占 位 符 控件 的 呈现 方式 ， 母 版 页 可 以 在 细节 上 控制 最 终 页 的 布局 。 

e 母 版 页 提供 一 个 对 象 模型 ， 使 用 该 对 象 模型 可 以 从 各 个 内 容 页 自 定 义 母 版 页 。 

在 使 用 母 版 页 时 ， 母 版 页 中 使 用 的 图 片 和 超 链接 应 尽量 使 用 服务 器 端 控件 来 实现 ， 如 
Image 和 HyperLink 控件 。 即 使 控件 不 需要 服务 器 代码 也 是 如 此 ， 因 为 将 设计 好 的 母 版 页 
或 内 容 页 移动 到 另 一 个 文件 夹 时 ， 如 果 使 用 的 是 服务 器 控件 ， 即 使 不 改变 服务 器 控件 的 
URL, ASP.NET 也 可 以 正确 解析 ， 并 自动 将 其 URL 改 为 正确 的 位 置 ， 但 是 如 果 使 用 了 普 
通 HTML 标记 ， 那 么 ASPNET 将 无 法 正确 解析 这 些 标记 的 URL， 从 而 导致 图 片 不 能 显示 
或 链接 失败 ， 给 维护 带 来 极 大 麻烦 。 
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当 创建 新 的 Web 站 点 时 , 总 是 先 添加 作为 所 有 其 他 页 面 基 础 的 母 版 页 。 即 使 站 点 中 只 
有 少数 几 个 页 面 ， 母 版 页 仍然 可 以 帮助 确保 整个 站 点 拥有 一 致 的 外 观 。 
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在 某 种 程度 上 ， 母 版 页 看 起 来 就 像 正常 的 ASPX 页 面 。 创 建 母 版 页 的 方法 也 和 创建 一 
般 页 面 的 方法 非常 相似 ， 区 别 是 母 版 页 无 法 单独 在 浏览 器 中 查看 ， 必 须 通 过 创建 内 容 页 才 
能 浏览 。 

1. 创建 母 版 页 


下 面 这 个 例子 是 一 个 很 常见 的 布局 ， 母 版 页 中 包含 一 个 标题 、 一 个 导航 菜单 和 一 个 页 
脚 ， 这 些 内 容 将 在 站 点 的 每 个 页 面 中 出 现 。 在 母 版 页 中 包含 两 个 个 内 容 占 位 符 ， 其 中 导航 
菜单 有 默认 内 容 ， 主 区 域 为 室 ， 这 是 母 版 页 中 的 一 个 可 变 区 域 ， 可 以 使 用 内 容 页 中 的 信息 
来 奉 换 此 区 域 。 

例 4-12: 创建 母 版 页 。 

(1) 启动 VWD 2010， 打 开 网 站 Chapter4。 

(2) 在 “解决 方案 资源 管理 器 ”中 右 击 网 站 的 名 称 ， 从 弹出 的 快捷 菜单 中 选择 “添加 
新 项 ”命令 , 在 打开 的 “添加 新 项 ”对 话 框 中 选择 “ 母 版 页 ”模板 ,添加 名 为 MasterPage.master 
的 母 版 页 。 

(3) 观察 母 版 页 的 源 代码 ,在 页 面 的 项 部 是 一 个 @ Master 声明 ,而 不 是 通常 在 ASP.NET 
页 面 中 看 到 的 @ Page 指令 ， 它 也 有 CodeFile 和 Inherits 属性 ， 如 下 所 示 : 


<%@ Master Language="C#" AutoEventWireup="true" CodeFile="MasterPage.master.cs" 
Inherits="MasterPage" %> 


(4) 此 外 ， 页 面 的 主体 部 分 还 包含 一 个 ContentPlaceHolder 控件 ， 这 是 母 版 页 中 的 一 
个 区 域 ， 其 中 的 可 替换 内 容 将 在 运行 时 由 内 容 页 合并 。 


说 明 : 
为 了 方便 母 版 页 的 编辑 ， 通 常情 况 下 先 将 ContentPlaceHolder 控件 删除 ， 母 版 页 编辑 
完成 后 再 放置 ContentPlaceHolder 控件 ， 下 面 的 步骤 将 采用 这 种 方法 布局 。 


(5) 在 母 版 页 的 <form> 标 记 之 间 添 加 下 面 的 代码 ， 蔡 换 掉 <div> 标 记 与 创建 母 版 页 时 
VWD 添加 的 ContentPlaceHolder。 


<form id="form1" runat="server"> 
<div id="PageWrapper"> 
<div id="top" align="center"><hl> 欢 迎 光临 金 百 合 拉丁 舞 培训 学 校 <hl></div> 
<div id="menu" align="right"> 
<asp:ContentPlaceHolder id="menuContent" runat="server"> 
<a href="Index.aspx"> 首 页 </a> <a href="Info.aspx"> 学 校 简介 </a> <a 
hre 伟 "About.aspx"> 关 于 我 们 </a> 
</asp:ContentPlaceHolder> 
</div> 
<div id="main"> 
<asp:ContentPlaceHolder ID="mainContent" runat="server"> 
</asp:ContentPlaceHolder> 
</div> 
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<div id="footer" align="center" style="colorGray"> 版 权 所 有 (C) 金 百合 拉丁 舞 培训 学 校 
2012.07.03</div> 
</div> 
</form> 


(6) 接 下 来 ， 将 母 版 页 切换 到 “设计 ”视图 中 ， 然 后 从 “解决 方案 资源 管理 器 ”中 将 
样式 表 文件 StyleSheet.css 拖 到 母 版 页 上 。 此 时 ，<head> 标 记 内 将 添加 一 个 指向 css 文件 
的 <link> 标 记 : 


<head runat="server"> 
<title></title> 
<asp:ContentPlaceHolder id="head" runat="server"> 
</asp:ContentPlaceHolder> 
<link href="StyleSheet.css" rel="stylesheet" type="text/css" /> 
</head> 


(7) 至 此 ， 完 成 母 版 页 的 创建 ， 该 母 版 页 的 设计 视图 效果 如 图 4-26 所 示 。 
lbody] 
欢迎 光临 金 百合 拉丁 舞 培训 学 校 
首页 学 校 简介 关于 我 们 
版 权 所 有 【CC) 金 百 台 拉丁 舞 培 训 学 校 2012. 07. 0 


图 4-26 母 版 页 设计 效果 


在 下 一 小 节 ， 将 介绍 如 何 将 基于 该 母 版 页 创建 内 容 页 。 
2. 母 版 页 详解 
已 经 创建 了 带 有 主 内 容 占 位 符 的 母 版 页 。 切 换 到 母 版 页 的 “ 源 ” 视 图 ， 将 发 现 页 面 的 
页 头 head 部 分 也 有 一 个 Content PlaceHolder。 
<asp:ContentPlaceHolder id="head" runat="server"> 
</asp:ContentPlaceHolder> 
每 创建 一 个 新 的 母 版 页 时 都 会 自动 添加 此 占 位 符 ， 在 内 容 页 中 可 以 用 它 来 添加 页 面 特 
有 的 位 于 页 面 的 <head> 标 记 之 间 的 内 容 ， 如 CSS( 包 括 内 嵌 样 式 表 和 外 部 样式 表 ) 和 
JavaScript。 
母 版 页 中 名 为 menuContent 的 ContentPlaceHolder 包含 3 个 超 链接 ， 这 是 可 以 作为 内 
容 页 的 默认 新 项 ， 当 基于 该 母 版 页 新 建 页 面 时 ， 内 容 页 既 可 以 重 写 这 部 分 内 容 ， 也 可 以 不 
写 


= 3 


3. REREN 

母 版 页 也 可 以 嵌 套 。 嵌 套 母 版 页 是 基于 另 一 个 母 版 页 的 母 版 页 。 内 容 页 面 则 可 以 基于 
嵌 套 母 版 页 。 如 果 有 一 个 目标 为 不 同 区 域 仍然 需要 共享 相同 外 观 的 Web 站 点 , KARER 
版 页 就 比较 有 用 。 例 如 ， 有 一 个 公司 网 站 ， 分 为 各 个 部 门 。 外 部 母 版 页 定义 站 点 的 全 局 外 
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观 ， 包 括 公司 logo 和 其 他 品牌 元 素 等 。 然 后 不 同 的 部 门 又 可 以 创建 自己 的 嵌 套 母 版 页 ， 这 
样 各 部 门 就 能 向 它们 在 站 点 的 部 分 中 加 上 自己 的 身份 标识 。 

嵌 套 母 版 页 的 创建 很 简单 。 当 添加 母 版 页 时 选中 “选择 母 版 页 ” 复 选 框 即 可 ， 就 像 后 
面 介绍 的 添加 内 容 页 一 样 。 然 后 ， 在 内 容 页 中 要 重 写 的 位 置 将 <asp:ContentPlaceHolder> 控 
件 添加 到 <asp:Content 控 件 中 。 


453 ”创建 内 容 页 


母 版 页 如 果 没 有 内 容 页 来 使 用 它 ， 那 就 没有 任何 用 处 。 通 常 ， 仅 有 少量 几 个 母 版 页 ， 
却 可 以 有 很 多 内 容 页 。 为 了 将 一 个 内 容 页 基于 一 个 母 版 页 ， 在 添加 新 网 页 到 站 点 时 ， 就 指 
定 母 版 页 ， 因此， 只 需 选 中 “添加 新 项 ”对 话 框 底部 的 “选择 母 版 页 ” 复 选 框 即 可 。 当 然 ， 
也 可 以 在 直接 在 页 面 的 @Page 指令 中 设置 MasterPageFile 属性 。 

内 容 页 中 只 能 含有 映射 到 母 版 页 中 的 <asp:ContentPlaceHolder> 控 件 的 <asp:Content> 控 
件 。 而 这 些 控件 又 可 以 包含 标准 标记 ， 如 HTML 元 素 和 服务 器 控件 声明 。 


提示 : 
因为 内 容 页 中 的 整个 标记 需要 用 <asp:Content> 标 记 括 起 来 ， 所 以 不 太 容易 将 现 有 
ASPX 页 面 转换 为 内 容 页 。 通 常 是 将 要 保留 的 内 容 复制 到 剪贴 板 上 ， 删 除 原 页 面 ， 然 后 基 


于 母 版 页 添加 新 页 面 ， 添 加 了 该 页 面 后 ,再 把 剪贴 板 上 的 内 容 粘贴 到 <asp:Content> 标 记 内 。 


例 4-13: 基于 例 4-12 创建 的 母 版 页 ， 创 建 相应 的 内 容 页 。 
(1) 启动 VWD 2010， 打 开 网 站 Chapter4。 
(2) 通过 “添加 新 项 ”对 话 框 添加 3 个 新 页 面 Index.aspx、Info.aspx、About.aspx。 添 
加 上 述 3 个 页 面 时 ， 需 要 选中 “添加 新 项 ”对 话 框 中 的 “选择 母 版 页 ” 复 选 框 ， 并 在 弹出 
的 “选择 母 版 页 ”对 话 框 中 选择 例 4-12 中 创建 的 母 版 页 MasterPage.master。 
G) 基于 母 版 页 新 建 的 网 页 初始 代码 如 下 所 示 : 
<%@ Page Title="" Language="C#" MasterPageFile="~/MasterPage.master" 
AutoEventWireup="true" CodeFile="Index.aspx.cs" Inherits="Index" %> 
<asp:Content ID="Content1" ContentPlaceHolderID="head" Runat="Server"> 
</asp:Content> 
<asp:Content ID="Content2" ContentPlaceHolderID="menuContent" Runat="Server"> 
</asp:Content> 
<asp:Content ID="Content3" ContentPlaceHolderID="mainContent" Runat="Server"> 
</asp:Content> 


(4) 指向 ContentPlaceHolder 的 Content 控件 的 ContentPlaceHolderID 属性 是 在 母 版 页 
中 定义 的 。ContentPlaceHolderID 为 head 的 占 位 符 就 是 用 来 添加 页 面 特 有 的 位 于 <head> 标 
记 之 间 的 内 容 的 ， 本 例 中 我 们 对 此 占 位 符 不 做 任何 修改 。 只 设置 菜单 内 容 和 主 内 容 区 域 。 

(5) 切换 到 Index.aspx 页 面 的 “设计 ”视图 , 单 击 menuContent 控件 右 侧 的 小 三 角 按钮 ， 
打开 “Content 任务 ”面板 ， 并 选择 “默认 为 母 版 页 的 内 容 ” 选项， 此 时 将 弹出 “确认 ”对 
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话 框 ， 提 示 用 户 如 果 使 用 母 版 页 的 内 容 将 从 网 页 中 删除 此 区 域 中 的 所 有 内 容 ， 单 击 “ 是 ” 
按钮 ， 如 图 4-27 所 示 。 


D 从 网 中 到 了 此 区 域 中 的 所 有 


图 4-27 “确认 ”对 话 框 


说 明 : 


将 默认 值 设置 为 母 版 页 的 内 容 之 后 ， 还 可 以 通过 “Content 任务 ”面板 中 的 “创建 自 定 
义 内 容 ” 选 项 来 创建 自己 的 内 容 


(6) 分 别 在 3 个 页 面 的 mainContent 区 域 添加 不 同 的 内 容 以 区 分 不 同 的 页 面 。 
(7) 编译 并 运行 程序 ， 当 在 浏览 器 中 请 求 基于 母 版 页 的 页 面 时 ， 服 务 器 会 阅读 内 容 页 
与 母 版 页 ， 将 两 者 合并 ， 然 后 将 最 终结 果 发 送 给 浏览 器 ， 效 果 如 图 4-28 所 示 。 
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图 4-28 页面 运行 效果 
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在 内 容 页 中 可 以 通过 编程 的 方式 访问 母 版 页 中 的 成 员 ， 包 括 母 版 页 上 的 任何 公共 属性 
或 方法 以 及 任何 控件 。 要 实现 内 容 页 对 母 版 页 中 定义 的 属性 或 方法 进行 访问 ， 则 该 属性 或 
方法 必须 声明 为 公共 成 员 (public)， 也 可 以 对 母 版 页 动态 地 进行 访问 。 

1. 访问 母 版 页 的 公共 成 员 


要 想 在 内 容 页 中 访问 母 版 页 上 的 属性 , 必须 在 母 版 页 上 先 创建 一 个 属性 , 下 面 举例 说 明 。 
例 4-14: 在 母 版 页 中 定义 一 个 属性 , 然后 在 基于 该 母 版 页 创建 的 内 容 页 中 访问 该 属性 。 
(1) 启动 VWD 2010， 打 开 网 站 Chapter4。 

(2) 打开 母 版 页 MasterPage.master 的 后 人 台 代码 文件 MasterPage.master.cs。 


G) 在 类 定义 中 创建 名 为 srName 的 属性 ， 并 在 视图 状态 中 存储 该 属性 的 值 。 添 加 的 
代码 如 下 : 
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public string strName 


t 
get{return (string)ViewState["myName"];} 
set { ViewState["myName"] = value; } 


} 
(4) 添加 页 面 的 Init 事件 处 理 程序 代码 ， 如 下 : 


void Page Init(Object sender, EventArgs e) 


i 
this.strName = "小 石头 "; 
} 


(5) 接 下 来 ,将 在 例 4-13 中 创建 的 内 容 页 About.apsx 中 访问 该 变量 .切换 到 About.aspx 
页 的 “ 源 ” 视 图 。 在 页 面 顶 部 的 @ Page 指令 下 面 添加 如 下 @ MasterType 指令 : 


<%@ MasterType virtualpath="~/MasterPage.master" %> 


此 指令 的 作用 是 将 内 容 页 的 Master 属性 绑 定 到 MasterPage.master 页 。 

(6) 切换 到 该 页 的 “设计 ”视图 ， 在 mainContent 区 域 中 添加 一 个 Label 控件 、 一 个 
TextBox 控件 和 一 个 Button 控件 ， 设 置 Button 控件 的 Text 属性 为 “提交 ”。 

(7) 在 About.aspx 页 面 的 Load 事件 处 理 程序 中 添加 如 下 代码 : 


protected void Page Load(object sender, EventArgs e) 


{ 
Labell.Text= "这 是 获取 到 母 版 页 中 的 变量 值 : " + Master.strName; 


) 
(8) 为 按钮 控件 添加 单 击 事件 处 理 程序 ， 代 码 如 下 : 


protected void Button1_Click(object sender, EventArgs e) 


{ 
if (TextBox1.Text != "") 
Í 
Master.strName = TextBox1. Text; 
Labell.Text = "这 是 获取 到 母 版 页 中 的 变量 新 值 : "+ Master.strName; 
) 
else 
Í 
string info = "alert(\" 请 输入 新 的 变量 值 ! Vn); "; 
Page.ClientScript.RegisterClientScriptBlock(this.GetType(), "warning", info, true); 
} 
} 


(9) 测试 内 容 页 ， 在 浏览 器 中 打开 页 面 About.aspx， 初 次 加 载 页 面 显示 和 母 版 页 中 变量 
的 初始 值 “ 小 石头 ”， 如 图 4-29 所 示 。 
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图 4-29 ”获取 母 版 页 中 的 变量 


(10) 在 文本 框 中 输入 新 的 变量 值 ， 然 后 单 击 “ 提 交 ” 按 钮 ， 之 后 的 效果 如 图 4-30 所 示 
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图 4-30 为 母 版 页 中 的 变量 设置 新 值 
动态 访问 母 版 页 


在 有 些 情况 下 ， 可 能 需要 动态 更 改 母 版 页 。 也 就 是 通过 编程 动态 地 设置 内 容 页 的 母 版 
例如 ,可 能 希望 允许 用 户 从 几 个 布局 中 进行 选择 ,根据 个 人 喜好 来 设置 不 同 的 母 版 页 

例 4-15: 创建 多 个 母 版 页 ， 使 用 户 可 以 选择 不 同 的 母 版 页 。 

(1) 启动 VWD 2010， 打 开 网 站 Chapter4 。 

(2) 通过 “添加 新 项 ”对 话 框 ,添加 一 个 名 为 MasterPage2 master 的 母 版 页 ， 新 创建 的 
母 版 页 和 第 1 个 母 版 页 MasterPage.master 非常 相似 ， 只 是 将 标题 栏 和 版 权 信 息 中 的 “ 金 百 
合 ” 换 成 “小 石头 ”， 然 后 将 导航 菜单 左 对 齐 ， 相 应 的 代码 如 下 所 示 


<form id="form1" runat="server"> 
<div id="PageWrapper"> 


<div id="top" align="center"><h1> 欢 迎 光临 小 石头 拉丁 舞 培训 学 校 <hl></div> 
<div id="menu" align="left"> 


<asp:ContentPlaceHolder id="menuContent" runat="server"> 


<a href="Index.aspx"> 首 页 </a> <a hre 人 "Info aspx"> 学 校 简介 </a> <a 
hre 人 "About aspx"> 关 于 我 们 </a> 


</asp:ContentPlaceHolder> 
</div> 
<div id="main"> 
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<asp:ContentPlaceHolder ID="mainContent" runat="server"> 
</asp:ContentPlaceHolder> 
</div> 
<div id="footer" align="center" style= "colorGray"> 版 权 所 有 (C) 小 石头 拉丁 舞 培训 学 校 
2012.07.03</div> 
</div> 
</form> 


(3) 打开 Info.aspx 页 面 ， 设 置 menuContent 控件 “默认 为 母 版 页 的 内 容 ”， 在 main- 
Content 控件 中 添加 一 个 Label 控件 和 一 个 DropDownList 控件 。 设 置 Label 控件 的 Text 属 
性 为 “选择 母 版 页 ”设置 DropDownList 控件 的 AutoPostBack 属性 为 True, 为 DropDownList 
添加 两 个 选项 ， 分 别 对 应 两 个 母 版 页 ， 生 成 的 代码 如 下 : 

<asp:Content ID="Content3" ContentPlaceHolderID="mainContent" Runat="Server"> 
<asp:Label ID="Labell" runat="server" Text=" 选 择 母 版 页 "></asp:Label> 
<asp:DropDownList ID="DropDownList1" runat="server" AutoPostBack="True" 
onselectedindexchanged="DropDownList1_SelectedIndexChanged" > 
<asp:ListItem Value="MasterPage.master"> 金 百合 </asp:ListItem> 
<asp:ListItem Value="MasterPage2.master"> 小 石头 </asp:ListItem> 
</asp:DropDownList> 
</asp:Content> 


(4) X DropDownList 控件 添加 SelectIndexChanged 事件 处 理 函 数 ， 代 码 如 下 : 


protected void DropDownList1_SelectedIndexChanged(object sender, EventArgs e) 
{ 
Session["masterpage"] = DropDownList1.SelectedValue; 
Response.Redirect(Request.Url.ToString()); 
) 


此 代码 将 根据 用 户 从 DropDownList 控件 中 的 选中 ， 将 相应 的 母 版 页 的 文件 名 加 载 到 
一 个 持久 的 会 话 变量 中 ， 然 后 刷新 当前 页 。 

(5) 为 Info.aspx 页 添加 PreInit 事件 处 理 程序 ， 将 当前 页 的 MasterPageFile 属性 设置 
为 会 话 变量 中 的 值 (如 果 有 )。 此 代码 必须 在 Page Prelnit 处 理 程序 中 运行 ， 因 为 必须 建立 
母 版 页 ， 使 得 页 面 可 以 创建 其 实例 ， 然 后 进一步 初始 化 。 代 码 如 下 ; 


protected void Page Prelnit(Object sender, EventArgs e) 


Í 
if (Session["masterpage"] != null) 
í 
this.MasterPageFile = (String)Session["masterpage"]; 
) 
j 


(6) 在 Info.aspx 页 的 PreRende 事件 中 初始 化 DropDownList 控件 ， 根 据 会 话 变量 中 的 
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值 (如 果 有 ) 判 断 哪个 选项 被 选中 。 代 码 如 下 : 


protected void Page_PreRender(object sender, EventArgs e) 


if (Session["masterpage"] != null) 
$ 
ListItemCollection items = DropDownList1 Items: 
for (int i = 0; i < items.Count; i++) 
{ 
if (items[i].Value.Equals((String)Session["masterpage"])) 
items[i].Selected = true; 
else 
items[i].Selected = false; 
i 
) 
) 


(7) 测试 Info.aspx 页 ， 默 认 将 加 载 母 版 页 MasterPage .master， 如 图 4-31 所 示 。 
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图 4-31 默认 加 载 母 版 页 MasterPage.master 


(8) 从 下 拉 列 表 中 选择 “小 石头 ”将 会 重新 显示 此 页 ， 但 这 一 次 使 用 的 是 
MasterPage2.master 母 版 页 ， 如 图 4-32 所 示 。 
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图 4-32 动态 切换 母 版 页 


4.6 本 章 小 结 


站 点 中 所 有 页 面 保 持 一 致 的 外 观 有 利于 使 站 点 看 起 来 更 专业 和 有 吸引 力 。 这 样 还 有 助 
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于 访问 者 在 站 点 中 找到 正确 的 信息 ， 增 加 他 们 再 次 访问 站 点 的 可 能 性 。ASP.NET 4 提供 了 
大 量 帮 助 创建 外 观 一 致 的 Web 站 点 的 工具 。 本 章 首先 介绍 了 CSS 样式 和 页 面 布 局 技术 ， 

包括 CSS 的 基本 语法 和 样式 规则 以 及 VWD 中 与 CSS 相关 的 各 种 面板 和 工具 的 使 用 。 接 下 
来 ， 学 习 了 主题 的 定义 与 使 用 ， 主 题 用 于 改变 站 点 中 页 面 的 外 观 以 及 它们 所 包含 的 控件 。 

主题 包含 CSS 文件 、 图 像 和 外 观 ， 因 此 可 以 直接 通过 应 用 主题 来 改变 页 面 的 颜色 、 字 体 、 
位 置 和 图 像 。 最 后 ， 介 绍 了 母 版 页 的 创建 与 使 用 技巧 ，ASP.NET 的 母 版 页 和 内 容 页 用 于 帮 
功 创建 布局 ， 可 以 在 每 个 基于 该 母 版 页 的 页 面 中 重复 使 用 这 个 布局 。 


4.7 思考 和 练习 


1. VWD 提供 了 哪些 使 用 CSS 的 便利 工具 ? 
2. 在 下 面 两 个 规则 中 ， 哪 个 规则 比较 容易 在 Web 站 点 中 跨 页 面 重用 ? 请 解释 原因 。 


#MainContent 


{ 
border: 1px solid blue; 


) 
.BoxWithBorders 


í 
border: 1px solid blue; 


h, 
. 如 何 定义 关联 选择 符 ? 
. 设置 页 面 的 Theme 属性 与 StyleSheetTheme 属性 ， 两 者 之 间 有 何 区 别 ? 
. 当 控 件 的 属性 和 主题 中 控件 的 外 观 定义 发 生 冲 突 时 ， 哪 个 有 较 高 优先 级 ? 
. 如 何 将 内 容 页 中 的 Content 控件 与 母 版 页 中 的 ContentPlaceHolder 关联 起 来 ? 
. 如 何 禁用 主题 ? 
创建 一 个 CSS 规则 ， 将 站 点 中 所 有 的 一 级 标题 (h1) 的 外 观 设置 如 下 : 
字体 使 用 Arial， 并 且 加 粗 ; 
颜色 为 红色 ; 
° 字体 大 小 为 18 像素 ; 
e° 上 边框 和 左边 框 为 蓝 色 细 边 。 
9. 设想 用 下 面 的 外 观 定义 创建 了 一 个 应 用 到 站 点 中 所 有 按钮 的 外 观 : 


e @ @% cow 上 w 


<asp:Button runat="server" CssClass="MyButton" /> 
该 CSS 类 MyButton 设置 按钮 的 背景 色 为 黑色 ， 前 景色 为 白色 。 为 了 使 页 面 中 的 一 个 
特定 按钮 引 人 注 目 ， 决 定 给 它 设 置 一 个 红色 背景 。 有 哪些 方法 可 以 控制 这 个 按钮 的 外 观 ? 
10. 指出 设置 页 面 Theme 属性 的 3 种 不 同方 式 ， 并 解释 这 些 方式 之 间 的 区 别 。 
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ASP.NET 应 用 程序 的 数据 访问 是 通过 ADO.NET 进行 的 ， ADO.NET 可 以 使 Web 应 用 
程序 从 各 种 数据 源 中 快速 访问 数据 。 本 章 首 先 介绍 数据 库 的 基本 知识 和 SQL 语言 , 接着 介 
绍 ADONET 访问 SQL Server 数据 库 和 访问 XML 数据 的 方法 , 最 后 介绍 了 ASPNET 提供 
的 数据 绑 定 技术 和 数据 控件 的 使 用 。 通 过 本 章 的 学 习 ， 读 者 应 该 掌握 如 何在 ASPX 页 面 中 
访问 和 操作 数据 源 ， 以 及 数据 信息 的 显示 与 更 新 。 学 会 设计 主 - 从 页 面 显 示 数 据 信 息 。 

本 章 学 习 目 标 : 

e 新 建 数据 库 和 表 
使 用 SQL 来 操纵 数据 
ADO.NET 的 基本 知识 
ADO.NET 访问 数据 库 的 方法 
掌握 单 值 和 列表 控件 的 数据 绑 定 
理解 数据 源 控 件 的 工作 原理 
掌握 GridView 控件 的 使 用 方法 和 技巧 
学 会 设计 主 -从 页 面 显示 数据 
ADO.NET 读 写 XML 文件 


5.1 数据 库 基础 知识 


数据 库 是 非常 有 用 的 ， 因 为 它 允 许 通过 结构 化 的 方式 来 存储 和 检索 数据 。 数 据 库 最 大 
的 好 处 是 能 够 在 运行 时 被 访问 ， 这 就 意味 着 在 VWD 中 ， 可 以 使 用 数据 库存 储 评论 、 音 乐 
流派 、 图 片 、 用 户 信息 ( 用 户 名 、 电子 邮件 地 址 、 密码 等 ) 和 日 志 信 息 等 , 然后 可 以 通过 ASPX 
页 面 访问 这 些 数 据 。 


5.1.1 什么 是 数据 库 


简单 来 说 ， 数 据 库 就 是 以 易于 访问 、 管 理 和 更 新 的 形式 排列 的 数据 的 集合 。 例 如 ， 日 
常生 活 中 ， 用 笔记 本 记录 亲戚 和 朋友 的 联系 方式 ， 将 他 们 的 姓名 、 地 址 以 及 电话 等 信息 都 
记录 下 来 。 这 个 “通讯 录 ” 就 是 一 个 最 简单 的 “数据 库 ”， 每 个 人 的 姓名 、 地 址 以 及 电话 
等 信息 就 是 这 个 数据 库 中 的 “数据 ”。 在 计算 机 领域 , 数据库 是 指 长 期 存储 在 计算 机 内 的 、 
有 组 织 的 、 可 共享 的 、 统 一 管理 的 相关 数据 的 集合 。 

最 为 流行 的 一 种 数据 库 是 关系 数据 库 (relational database)。 这 种 数据 库 常 用 于 Web 站 
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点 中 ， 也 将 用 于 本 书后 续 部 分 。 不 过 ， 关 系数 据 库 并 不 是 唯一 的 数据 库 类 型 。 还 有 其 他 类 
型 的 数据 库 ， 包 括 平面 文件 数据 库 、 对 象 关 系数 据 库 和 面向 对 象 数据 库 ， 但 它们 在 Internet 
应 用 程序 中 不 常见 。 
关系 数据 库 中 有 表 (table) 的 概念 ， 其 中 数据 以 行 和 列 的 形式 存储 ， 如 同 电子 表格 一 样 。 
表 中 的 每 行 包含 存储 于 其 中 的 记录 项 的 完整 信息 ， 而 每 列 包含 表 中 记录 项 的 特定 属性 的 信息 。 
“关系 ” 指 的 是 数据 库 中 不 同 表 相 互 关 联 的 方式 。 它 不 是 将 相同 的 数据 一 遍 凯 地 复制 ， 
而 是 在 其 自己 的 表 中 存储 重复 的 数据 ， 然 后 从 其 他 表 中 创建 与 该 数据 的 关系 。 
在 ASPNET 项 目 中 ， 可 以 使 用 多 种 不 同类 型 的 数据 库 ， 包 括 Microsoft Access、SQL 
Server, Oracle 和 MySQL .不 过 ,在 ASP.NET 4 Web 站 点 中 最 常用 的 数据 库 是 Microsoft SQL 
Server。 本 书 主 要 使 用 Microsoft SQL Server 2008 Express Edition， 因 为 它 是 随 VWD 免费 
提供 的 ， 有 着 许多 创新 性 的 功能 。 而 且 ， 由 于 其 数据 库 引 擎 与 SQL Server 2008 商业 版 相 
同 ， 因 而 可 以 在 开发 周期 的 后 续 阶 段 轻松 地 升级 到 商业 版 本 。 


5.1.2 ”新 建 数据 库 和 表 


要 使 用 数据 库 首 先 就 要 创建 数据 库 和 表 。 本 节 将 介绍 如 何 新 建 SQL Server 数据 库 ， 并 
在 数据 库 中 新 建 数据 表 和 表 之 间 的 关系 。 本 书后 面 的 章节 将 主要 使 用 该 数据 库 。 
1. 新 建 SQL Server 数据 库 


例 5-1: 在 VWD 的 “服务 器 资源 管理 器 ”窗口 中 连接 到 SQL Server 服务 器 ， 并 新 建 
数据 库 WeiBo。 

(1) 首先 ， 选择“ 视图 ”|“ 服 务 器 资源 管理 器 ”命令 ,打开 “服务 器 资源 管理 器 ”窗口 。 

(2) 在 “服务 器 资源 管理 器 ”窗口 中 右 击 “ 数 据 连接 ”, 在 弹出 的 快捷 菜单 中 选择 “新 
建 SQL Server 数据 库 ” 命 令 ， 如 图 5-1 所 示 。 

(3) 此 时 将 打开 “创建 新 的 SQL Server 数据 库 ” 对 话 框 ， 如 图 5-2 所 示 。 
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图 5-1 “服务 器 资源 管理 器 ”窗口 图 5-2 “创建 新 的 SQL Server 数据 库 ” 对 话 框 


(4) 在 “服务 器 名 ”文本 框 中 输入 SQL Server 数据 库 服务 器 名 称 , 通常 为 “[ 机 器 名 ]\[ 数 
据 实例 名 ]” 的 格式 ， 然 后 选择 登录 到 服务 器 的 方式 ， 最 后 在 “新 数据 库 名 称 ” 文 本 框 中 输 
入 新 建 数据 库 的 名 称 WeiBo。 
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(5) 单 击 “确定 ”按钮 ， 便 创建 了 一 个 空 数据 库 WeiBo， 此 时 可 以 在 “服务 器 资源 管 
理 器 ”窗口 中 看 到 连接 到 WeiBo 的 数据 连接 ， 如 图 5-3 所 示 。 


说 明 : 
如 果 要 连接 到 已 有 的 数据 库 ， 则 可 以 在 右 击 “数据 连接 ”时 从 弹出 的 快捷 菜单 中 选择 
“添加 连接 ”命令 ， 在 打开 的 “添加 连接 ”对 话 框 中 进行 操作 即 可 ， 如 图 5-4 所 示 。 
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图 5-3 新建 数 据 库 后 的 “服务 器 资源 管理 器 ”窗口 图 5-4 “添加 连接 ”对 话 框 


有 了 与 数据 库 的 连接 ， 就 可 以 处 理 该 数据 库 中 的 对 象 。 使 用 VWD 的 内 置 数 据 库 工具 
创建 和 操纵 SQL Server 2008 数据 库 表 很 容易 。 接 下 来 就 介绍 如 何在 数据 库 中 创建 自己 的 表 。 

2. SQL Server 中 的 数据 类 型 

与 Visual Basic .NET 和 C# 这 样 的 编程 语言 一 样 , SQL Server 数据 库 也 使 用 不 同 的 数据 
类 型 来 存储 数据 。SQL Server 2008 支持 30 多 种 不 同 的 数据 类 型 ， 大 部 分 与 NET 中 使 用 的 
类 型 相似 。 表 5-1 列 出 了 最 常用 的 SQL Server 数据 类 型 及 其 说 明 。 


表 5-1 SQL Server 数据 类 型 


5 m i 对 应 的 .NET 数据 类 型 
数据 类 型 

bit 以 0/1 格式 存储 布尔 值 (1 表示 True, 0 表示 False) System.Boolean 

包含 固定 长 度 的 文本 。 如 果 存 储 的 文本 短 于 定义 的 长 度 ， 
char/nchar 就 用 空格 填充 。nchar 以 Unicode 格式 存储 数据 ， 允 许 存 | System.String 

储 用 各 种 语言 编写 的 数据 
datetime 存储 日 期 和 时 间 System.DateTime 
datetime2 与 datatime 类 型 相似 ， 但 具有 更 高 的 精度 和 范围 System DateTime 
date 存储 日 期 ， 没 有 时 间 元 素 System.DateTime 
time 存储 时 间 ， 没 有 日 期 元 素 System TimeSpan 
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( 续 表 ) 
SQL Server 2008 _ 
描 R 对 应 的 .NET 数据 类 型 
数据 类 型 

decimal 允许 存储 较 大 的 小 数 ， 最 多 可 存储 38 个 数字 System Decimal 
允许 存储 较 大 的 小 数 ， 被 称 为 近似 的 数据 类 型 ， 近 似 数 

float 字数 据 类 型 并 不 存储 为 多 数 数字 指定 的 精确 值 ， 它 们 只 | System.Double 
储存 这 些 值 的 最 近似 值 
允许 存储 大 的 二 进 制 对 象 ， 如 文件 。 尽 管 其 名 称 暗 示 了 

image 只 可 用 它 存储 图 像 ， 但 事实 并 非 如 此 。 可 用 它 存储 任何 | System.Byte[] 
类 型 的 文档 或 其 他 二 进 制 对 象 

tinyint 用 于 存储 0-255 之 间 的 整数 System.Byte 

smallint 用 于 存储 -32 768-32 767 之 间 的 整数 System Int16 

int 用 于 存储 -2 147 483 648-2 147 483 647 之 间 的 整数 System Int32 
用 于 存储 -9 223 372 036 854 775 808~ 

bigint R System Int64 
9 223 372 036 854 775 807 之 间 的 较 大 整数 

text/ntext 用 于 存储 较 多 的 文本 System.String 
用 于 存储 变 长 的 文本 。nvarchar 以 Unicode 格式 存储 数据 ， 

varchar/nvarchar TAMANA g NOSA System.String 
这 样 就 可 以 存储 用 各 种 语言 编写 的 数据 

uniqueidentifier 存储 全 局 唯一 标识 符 System.Guid 


其 中 的 一 些 数据 类 型 允许 指定 最 大 长 度 。 在 定义 char, nchar, varchar 或 nvarchar 类 型 
的 列 时 , 需要 指定 字符 长 度 。 例如 , nvarchar(10) 最 多 可 存储 10 个 字符 。 从 SQL Server 2005 
开始 ， 到 SQL Server 2008 之 前 的 SQL Server 版 本 ， 这 些 数据 类 型 都 允许 指定 MAX 为 最 
大 值 。 通 过 MAX 说 明 符 ， 可 以 在 单个 列 中 最 多 存储 2GB 的 数据 。 对 于 大 段 的 文本 ， 像 评 
论 主体 部 分 ， 应 该 考虑 使 用 nvarchar(max) 数 据 类 型 。 如 果 清 楚 某 列 ( 像 邮政 编码 或 手机 号 ) 
的 最 大 长 度 或 想 显 式 限制 其 长 度 ， 则 可 以 指定 这 一 长 度 。 例 如 ， 评 论 的 标题 应 存储 于 
nvarchar(200) 的 列 中 ， 限 制 最 大 字符 数 为 200。 

3. 主键 和 标识 列 


主键 是 为 了 唯一 标识 表 中 记录 的 一 个 或 多 个 列 。 如 果 将 一 列 标识 为 主键 ， 那 么 数据 库 
引擎 就 可 以 确保 最 终 不 会 出 现 具 有 相同 值 的 两 个 记录 。 主键 可 以 由 单个 列 (例如 ,包含 了 表 
中 每 条 记录 的 唯一 数值 的 数字 列 ) 组 成 , 也 可 以 由 多 个 列 组 成 , 这 些 列 组 合 起 来 构成 整 条 记 
录 的 唯一 ID。 

SQL Server 也 支持 标识 列 。 标识 列 是 一 个 数字 列 , 其 值 是 在 插入 新 记录 时 自动 生成 的 。 
它们 通常 用 作 表 的 主键 。 


说 明 : 
主键 不 是 必须 的 ， 但 是 设置 了 主键 可 以 使 数据 库 编 程 人 员 的 工作 变 得 简单 ， 因 此 建议 
为 表 添加 主键 。 
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4. 设计 并 创建 表 
前 面 已 经 创建 了 数据 库 WeiBo， 该 数据 库 将 设计 为 一 个 简易 微 博 系统 的 后 台数 据 库 。 
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微 博 是 随 着 Web 2.0 而 兴起 的 一 类 开放 的 互联 网 社交 服务 ， 因 其 具有 简单 易 用 、 门 槛 低 、 


传播 即时 等 特点 而 迅速 吸引 了 众多 互联 网 爱好 者 。 它 允许 用 户 以 简短 文字 随时 随地 更 新 


己 的 状态 ， 每 条 信息 的 长 度 都 在 140 字 以 内 ， 每 个 用 户 既是 微 内 容 的 创造 者 也 是 微 内 容 的 


传播 者 和 分 享 者 。 


例 5-2: 设计 WeiBo 数据 库 中 的 表 ， 并 使 用 VWD 的 内 置 数据 库 工具 创建 这 些 表 。 
(1) 在 “服务 器 资源 管理 器 ”窗口 中 ， 展 开 “ 数 据 连接 ”， 然 后 继续 展开 例 5-1 中 创 


建 的 数据 库 WeiBo。 


(2) 右 击 下 面 的 “ 表 ” 节 点 ， 从 弹出 的 快捷 菜单 中 选择 “添加 新 表 ” 命 令 ， 将 打开 表 
的 “设计 ”窗口 ， 如 图 5-5 所 示 。 在 此 窗口 中 ， 可 输入 构成 表 定 义 的 列 名 和 数据 类 型 。 
(3) 首先 来 设计 用 户 信息 表 Z_USER。 该 表 主 要 是 存储 用 户 的 相关 信息 ， 上 基体 字段 信 


息 如 表 5-2 所 示 。 


表 5-2 Z USER 表 字段 信息 


字段 名 称 数据 类 型 描述 
user_id int 用 户 编 号 ， 主 键 ， 标 识 列 
User name nvarchar(50) 用 户 名 ， 非 空 
user login varchar(50) 登录 名 ， 非 空 
user password varchar(20; 登录 密码 ， 非 空 
User sex varchar(2) 性 别 ， 只 能 为 “ 男 ” 或 “ 女 ”， 非 空 
user photo image 用 户头 像 ， 可 空 
user_email varchar(32 用 户 邮 箱 ，email， 可 空 
regist_time datetime 注册 时 间 ， 非 空 
user address nvarchar(64; 用 户 地 址 ， 可 空 
user birthda; datetime 出 生日 期 ， 可 空 
user telephone varchar(16) 手机 号 码 ， 可 空 
home url varchar(20) 微 博 地 址 ， 非 室 ， 其 他 用 户 访问 时 所 用 的 url 
user info nvarchar(64) 自我 介绍 ， 可 空 


输入 user id 列 并 选择 数据 类 型 后 ， 取 消 选择 “允许 为 null” 列 的 复 选 枉 ， 即 设置 该 列 


非 空 。 接 着 ， 单 击 该 列 单元 格 左 侧 的 黑色 箭头 标识 ， 选 取 整 行 ， 然 后 单 击 “ 表 设计 器 ” 工 


其 栏 中 的 “设置 主键 ”按钮 ， 如 图 5-6 所 示 ， 将 该 列 设置 为 主键 。 


说 明 : 


默认 情况 下 , 标识 列 的 第 一 条 记录 的 值 为 1, 后 续 记 录 依 次 加 1。 可 以 通过 “标识 规范 ” 
选项 中 的 “标识 增 量 ”和 “标识 种 子 ”进行 设置 ， 来 改变 列 的 默认 行为 。 
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int 


nvarchar (50) 
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图 5-5 表 的 “设计 ”窗口 图 5-6 “ 表 设计 器 ”工具 栏 


在 表 定 义 的 下 面 是 “ 列 属性 ”面板 ,在 user_id 列 仍 处 于 选中 状态 下 时 , 展开 “ 列 属性 ” 
面板 中 的 “标识 规范 ”选项 ， 将 “(是 标识 )” 选 项 设置 为 “是 ”， 如 图 5-7 所 示 ， 将 该 列 
设置 为 标识 列 。 

按 表 5-2 所 示 设 置 完 其 他 字段 信息 后 ， 单 击 工 具 栏 中 的 “保存 ”按钮 ， 将 弹出 “选择 
名 称 ” 对 话 框 ， 要 求 为 该 表 提供 一 +f, 如 图 5-8 所 示 。 输 入 Z _USER 作为 表 名 ， 然 后 
单 击 “确定 ”按钮 ， 完 成 表 Z USER 的 创建 。 


[wan X 
输入 表 名 称 EE) 
Z_USER 
C s= J 
图 5-7 设置 “标识 规范 ”属性 图 5-8 “选择 名 称 ” 对 话 杠 


(4) 接 下 来 设计 信息 表 Z_MESSAGE， 该 表 存 储 用 户 发 表 的 微 博 信息 ， 上 有 具体 字段 信息 
如 表 5-3 所 示 。 


表 5-3 Z MESSAGE 表 字 段 信息 


段 名 称 描述 
msg id 信息 编号 ， 主 键 ， 标 识 列 
user_id 用 户 编号 ， 非 空 
msg content nvarchar(140) 信息 内 容 ， 非 空 
reply_count int 评论 次 数 ， 非 空 


post time 发 表 时 间 ， 非 空 


“152 。 ASPNET 4.0 网 站 开发 实例 教程 


(5) 消息 评论 表 Z_REPLY 用 于 存储 其 他 用 户 评论 某 条 信息 的 记录 , 具体 字段 信息 如 表 
5-4 所 示 。 


表 5-4 Z REPLY 表 字段 信息 


Ja 述 
评论 编号 ， 主 键 ， 标 识 列 
信息 编号 ， 非 空 
评论 用 户 编号 ， 非 空 
被 评论 用 户 编号 ， 非 空 
评论 内 容 ， 可 空 
评论 时 间 ， 非 空 


msg id 


reply_user_id 


Src_user id 


reply content 


datetime 


(6) 不 同 用 户 之 间 可 以 收听 ， 所 以 还 需要 一 个 关注 用 户 表 Z_USER_FUN， 有 具体 的 字段 
信息 如 表 5-5 所 示 。 


表 5-5 Z_USER_FUN 表 字 段 信息 


字段 名 称 Ho 
fun id 收听 用 户 关系 编号 ， 主 键 ， 标 识 列 
user id 用 户 编号 ， 非 空 
fun user id "uwa 收听 用 户 编号 ， 非 空 
技巧 : 


一 旦 创建 好 表 ， 如 果 要 对 其 进行 修改 ， 如 增加 字段 或 修改 某 个 字段 的 数据 类 型 等 ， 可 
以 右 击 表 名 ， 从 弹出 的 快捷 菜单 中 选择 “打开 表 定 义 ”命令 ， 打 开 表 的 设计 视图 进行 修改 。 


也 可 以 给 上 述 表 中 的 时 间 类 型 的 字段 列 指定 默认 值 。 默 认 值 是 在 插入 数据 时 ， 如 果 没 
指定 该 列 的 数据 ， 数 据 库 会 自动 插入 默认 值 。 对 于 上 述 时 间 类 型 的 列 ， 可 以 设置 默认 值 为 
getdate()， 它 会 自动 插入 当前 日 期 和 时 间 。 

5. 创建 表 之 间 的 关系 


在 前 面 创建 的 4 张 表 中 , 很 显然 , 表 之 间 存 在 一 定 的 关系 。 例 如, 信息 表 Z_MESSAGE 
中 的 user_id 应 该 来 源 于 Z_USER 表 中 的 user id， 以 标识 该 信息 是 哪个 用 户 发 表 的 。 

现在 ， 假 设 有 一 个 用 户 注 销 了 微 博 账 户 ， 需 要 删除 Z_USER 表 中 相应 的 记录 。 如 果 没 
有 关系 存在 ， 那 么 数据 库 会 允许 进行 这 一 操作 。 不 过 ， 这 会 带 来 一 些 麻 烦 。 因 为 当 再 次 党 
试 显示 Z_ MESSAGE 表 中 该 用 户 发 表 的 信息 时 ， 将 无 法 获取 该 信息 作者 的 详细 资料 。 

为 了 避免 这 类 问题 ， 使 数据 库 保 持 良 好 的 、 一 致 的 状态 ， 可 以 在 两 表 之 间 创 建 关系 。 
在 建立 了 正确 的 关系 后 ， 数 据 库 将 阻止 无 意 间 从 一 个 仍 有 其 他 记录 与 之 关联 的 表 中 删除 
记录 。 

除了 保护 数据 外 ， 关 系 也 使 得 数据 模型 更 清晰 。 通 过 关系 图 查看 数据 库 ， 有 助 于 更 好 
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地 理解 表 的 连接 方式 和 它们 表示 的 数据 。 

可 以 通过 在 一 个 表 的 主键 和 另 一 个 表 的 列 之 间 创 建 关系 来 进行 关系 的 定义 。 在 另 一 个 
表 中 的 列 通常 被 称 为 外 键 (foreign key). 

例 5-3: 在 表 之 间 创 建 关系 。 

(1) 在 “服务 器 资源 管理 器 ”窗口 中 ， 展 开 “ 数 据 连接 ”， 然 后 继续 展开 例 5-1 中 创 
建 的 数据 库 WeiBo。 

(2) 在 表 之 间 可 视 化 地 添加 关系 之 前 ， 需 要 为 数据 库 添 加 一 个 关系 图 。 关 系 图 是 一 个 
可 帮助 理解 和 定义 数据 库 的 可 视 化 工具 。 在 关系 图 上 ， 可 以 将 表 的 一 列 拖 至 另 一 个 表 中 来 
创建 关系 。 右 击 “ 数 据 库 关系 图 ”节点 ， 从 弹出 的 快捷 菜单 中 选择 “添加 新 关系 图 ”命令 。 
如 果 是 首次 将 关系 图 添加 到 数据 库 中 ， 将 会 出 现 一 个 对 话 框 ， 询 问 是 否 希望 VWD 将 执行 
该 操作 的 用 户 作为 数据 库 的 所 有 者 。 单 击 “ 是 ”按钮 继续 。 

(3) 在 随后 打开 的 “添加 表 ” 对 话 框 中 ， 选 择 前 面 创建 的 所 有 表 ， 单 击 “ 添 加 ”按钮 
将 表 添 加 到 关系 图 中 ， 如 图 5-9 所 示 。 然 后 单 击 “ 关 闭 ” 按 钮 关闭 对 话 框 。 

(4) 在 Z_USER 表 上 ， 单 击 user id 列 ( 它 应 包含 黄色 钥匙 图 标 ， 表 明 这 是 表 的 主键 ) 的 
左 侧 ， 然 后 将 它 拖 至 Z_MESSAGE J user id 列 上 并 释放 鼠标 键 。 此 时 将 弹出 “ 表 和 列 ” 
对 话 框 ， 指 定 了 新 建 关 系 的 名 称 和 主键 表 与 外 键 表 中 的 字段 列 ， 如 图 5-10 所 示 。 


| w—J 
关系 名 如 : 
FK Z MESSAGE Z_USER | 
= zero: nen: 
sm oooO o amsa | 
L a 
图 5-9 “添加 表 ” 对 话 框 图 5-10 “ 表 和 列 ” 对 话 框 


O) 单 击 “ 确 定 ” 按 钮 关闭 “ 表 和 列 ” 对 话 框 ， 将 显示 如 图 5-11 所 示 的 “外 键 关系 ” 
对 话 框 , 将 “强制 外 键 约束 ”选项 设置 为 “是 ”。 这 一 属性 确保 了 如 果 还 有 信息 与 Z_USER 
表 中 相应 的 user_id 的 记录 关联 ， 那 么 就 不 能 从 该 Z_USER 表 中 删除 记录 。 


图 5-11 “外 键 关系 ”对 话 框 
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(6) 单 击 “ 确 定 ?按钮 完成 关系 的 创建 ,此 时 , 关系 图 中 两 表 之 间 显 示 一 条 线 。 在 Z_USER 
表 这 一 边 可 以 看 到 用 一 个 黄色 钥匙 图 标 表 明 该 表 包 含 关 系 的 主键 。 而 在 另 一 边 可 以 看 到 用 
无 穷 符号 (co) 表 明 Z MESSAGE 表 中 有 多 条 使 用 相同 user_id 的 记录 ， 如 图 5-12 所 示 。 

注意 : 

这 两 个 表 之 间 的 线 并 不 一 定 总 是 指向 正确 的 列 。 这 样 很 容易 使 人 混淆 ， 为 了 确认 参与 
关系 中 的 列 ， 可 右 击 两 个 表 之 间 的 线 ， 从 弹出 的 快捷 菜单 中 选择 “属性 ”命令 ， 在 “属性 ” 
面板 中 找到 “ 表 和 列 规范 ”选项 ， 即 可 查看 哪个 列 和 表 位 于 关系 中 ， 如 图 5-13 所 示 。 


i ?9x 
[关系 ] FK_Z_MESSAGE_Z_USER ` 
SAE) 

(名 称 ) FK_Z_MESSAGE_Z_USER |A 
EJ INSERT 和 UPDATE £ 


日 表 和 列 规范 GJ 


强制 外 键 约束 是 
强制 用 于 复制 。 是 
RR 


图 5-12 关系 图 显示 效果 图 5-13 查看 “ 表 和 列 规范 ”属性 


(7) 用 同样 的 方法 建立 其 他 表 之 间 的 关系 : Z REPLAY 表 的 msg id 与 Z MESSAGE 
表 中 的 msg id 关联 ; Z REPLAY 表 的 reply_user id、src_user id Jj Z USER J user_id 
关联 ，Z_USER_FUN 表 中 的 user_id, fun user id 均 与 Z_USER 表 的 user_id 关联 。 

(8) 单 击 “ 保 存 ” 按 钮 ， 保 存 对 关系 图 的 更 改 。 可 以 将 名 称 设置 为 其 默认 值 Diagraml 
或 是 输入 一 个 更 具 描 述 性 的 名 称 。 

6. 添加 和 删除 表 中 的 数据 


如 果 在 两 个 表 之 间 创 建 了 关系 ， 那 么 在 试图 插入 、 修 改 或 删除 数据 时 ， 数 据 库 将 强制 
这 一 关系 。 这 里 将 通过 VWD 内 置 的 数据 库 工 具 向 表 中 插入 数据 ， 然 后 进行 删除 操作 ， 验 
证 表 间 关系 的 约束 。 后 面 的 章节 将 会 介绍 如 何在 自己 的 Web 站 点 上 处 理 这 种 情况 ， 以 及 如 
何 向 用 户 显示 友好 的 错误 提示 。 

例 5-4: 通过 VWD 内 置 的 数据 库 工 具 ， 向 表 中 插入 一 些 数据 ， 然 后 尝试 删除 具有 外 键 
关系 的 主 表 中 的 记录 ， 验 证 外 键 关系 的 约束 。 

(1) 在 “服务 器 资源 管理 器 ”窗口 中 , 右 击 Z_USER 表 ， 从 弹出 的 快捷 菜单 中 选择 “ 显 
示 表 数据 ”命令 ， 打 开 表 的 数据 视图 。 

(2) ERR user id 之 外 的 其 他 非 空 字段 中 分 别 输入 一 些 用 户 信 息 ， 然 后 按 Tab 键 离开 当 
前 行 ， 则 该 行 数据 就 被 插入 到 数据 库 中 了 ， 并 且 user id 列 会 自动 用 一 个 唯一 的 序号 填充 。 
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终 得 到 的 列表 如 图 5-14 所 示 。 


a ame |user_login user_password ex user. user_email  regist_time ser_aairess user_birthday |user_tele... homeurl | user_info 
1 AIHE — yanduozh zhaol234 5 n zhaoyanduc@t... 2012-7-7 10:28:59 北京 市 海流 区 1981-4-29 11... 15910806516 yanduozh REFEP 
2 小 石头 xst 12345st, 男 Mr littlestone@... 2012-7-7 10:31:42 浙江 省 杭州 市 2010-3-19 22... 18801012313 。 xst875614341 我 妈妈 跟 人 | 
3 zaa dahai dahail23 Ed ni gemn@qg com 2012-7-7 10:33:17 河北 省 沧州 市 1986-1-10 16... 13831705888  genm 永远 的 大 海 | 
mr mur mat mar mr m mr m mat mat m mat m 


图 5-14 Z USER 表 中 插入 的 记录 


(3) 用 同样 的 方法 打开 Z USER FUN K, 向 其 中 的 user id 和 fun_user id 列 输入 数据 ， 
由 于 这 两 列 都 是 与 Z_USER 表 中 的 user id 关联 的 ,所 以 只 能 输入 Z_USER 表 中 存在 的 值 ( 当 
前 只 能 是 1、2、3)， 如 果 试 图 输入 其 他 值 ， 将 会 弹出 如 图 5-15 所 示 的 提示 对 话 框 。 


mr r— x  — 
e ee 
行 +: 
ASE Sa pas nias 
MAR, Testi BENS ETS WT BIR -Pi.2 ISEA FU Z ISEN SR, RRE FAEE WeiBe” , W° ato ZEEE colum 
WEEE 
WETIRE RE 82 Run BES. 
CI 


图 5-15 插入 数据 时 外 键 约束 冲突 提示 对 话 框 


(4) 在 Z_USER_FUN 表 输 入 一 些 数据 后 ， 再 次 打开 Z_USER 表 的 “数据 ”视图 ， 选 中 
其 中 某 条 记录 ， 单 击 鼠 标 右 键 ， 从 弹出 的 快捷 菜单 中 选择 “删除 ”命令 ，VWD 将 显示 如 
图 5-16 所 示 的 提示 对 话 框 ， 提 示 不 能 删除 该 记录 。 

说 明 : 

只 有 当 要 删除 的 用 户 对 应 的 user id 在 所 有 外 键 关 联 表 中 都 没有 记录 时 , 才能 删除 该 用 户 。 


cro: a o 


a) ”未 骨 除 任何 行 。 
Y 2 时 发 生 | 
i Providers, 
ARM, DELETE 语 避 与 REFERENCE 约束 FK Z USER FUNZ USER PR. MPRREFBIEE Weibo” , F"dbo. Z_USER_FUN", colunn 


EE 
请 更 正夫 误 并 重 试制 除 识 行 ,或 按 Ese WAEN. 


CC 要 CC] 


图 5-16 ”删除 数据 时 外 键 约束 冲突 提示 对 话 杠 


5.2 SQL 简介 


为 了 成 功 地 在 ASPX 页 面 中 运用 数据 库 ， 将 学 习 如 何 使 用 一 种 名 为 SQL(Structured 
Query Language， 结 构 化 查询 语言 ) 的 查询 语言 来 访问 数据 库 。 它 是 用 于 查询 关系 数据 库 的 
实际 语言 ， 几 乎 所 有 的 关系 数据 库 系统 都 能 理解 它 。SQL 有 许多 明确 的 标准 ， 其 中 最 流行 
的 是 ANSI 92 SQL 标准 。 
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5.2.1 SQL 概述 


SQL 语言 是 一 种 介 于 关系 代数 和 关系 演算 之 间 的 结构 化 查询 语言 ， 其 功能 并 不 仅仅 是 
查询 , 还 具备 数据 定义 和 数据 操纵 等 功能 , ANSI( 美 国 国家 标准 协会 ) 规 定 SQL 为 关系 型 数 
据 库 管 理 系 统 的 标准 语言 。 目 前 ， 绝 大 多 数 流行 的 关系 型 数据 库 管 理 系 统 ， 如 Oracle、 
Sybase, Microsoft SQL Server, Access 等 ， 都 采用 了 SQL 语言 标准 。 

Microsoft SQL Server 2008 数据 库 支 持 ANSI 92 SQL 标准 中 定义 的 大 部 分 语法 。 在 这 
一 标准 之 上 ，Microsoft 又 添加 了 一 些 专用 扩充 ， 合 起 来 称 为 T-SQL(Transact SQL). ZP 
后 续 部 分 都 会 使 用 SQL 这 一 术语 。 

总 的 来 说 ，SQL 语言 具有 如 下 特点 。 

e° 类 似 于 英语 自然 语言 ， 简 单 易学 。 

e 是 一 种 非 过 程 语言 。 

e 是 一 种 面向 集合 的 语言 。 

° 

° 


既 可 独立 使 用 ， 又 可 嵌入 到 宿主 语言 中 使 用 。 
具有 查询 、 操 纵 、 定 义 和 控 制 一 体 化 功能 。 
SQL 语言 包含 4 个 部 分 。 
o 数据 定义 语言 (DQL，Data Definition Language): CREATE, ALTER, DROP 
° 数据 查询 语言 (DQL，Data Query Language): SELECT, 
o 数据 操纵 语言 DQL，Data Manipulation Language): INSERT, UPDATE, DELETE 
o 数据 控制 语言 DQL，Data Control Language): COMMIT, ROLLBACK 
对 于 数据 库 编 程 人 员 来 说 ， 与 数据 库 交 互 时 ， 使 用 最 多 的 就 是 查询 和 操纵 数据 。 所 以 
本 书 重点 介绍 SELECT、INSERT、UPDATE、DELETE 4 个 语句 。 


说 明 : 
SQL 语言 不 区 分 大 小 写 ，SELECT 与 Select 的 含义 是 相同 的 。 为 了 统一 起 见 ， 本 书 中 
所 书写 的 SQL 命令 全 部 使 用 大 写 形式 。 


5.2.2 SELECT 语 和 名 


要 从 数据 库 中 读 取 数据 ， 首 先 需 要 指定 要 从 哪个 表 中 检索 什么 列 ， 这 是 通过 SELECT 
语句 完成 的 ; 需要 使 用 FROM 关键 字 指 定 表 名 ; 然后 需要 筛选 数据 ， 确 保 只 返回 符合 条 件 
的 记录 ， 可 以 使 用 SQL 语句 中 的 WHERE 子 句 筛选 数据 ; 最后， 可 以 使 用 ORDER BY f- 
句 对 结果 进行 排序 。 

完整 的 SELECT 语句 的 语法 格式 如 下 ， 其 中 方 括号 中 的 子 句 都 是 可 选 的 : 

SELECT 目标 表 的 列 名 或 列表 达 式 集合 


FROM 基本 表 或 (和 ) 视 图 集合 
[WHERE 条 件 表 达 式 ] 
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[GROUP BY 列 名 集合 [HAVING 组 条 件 表达 式 ] ] 
[ORDER BY 列 名 [集合 ] …] 


首先 从 FROM 子 句 列 出 的 表 中 , 选择 满足 WHERE 子 句 给 出 的 条 件 表达 式 的 记录 ， 然 
后 按 GROUPBY 子 句 (分 组 子 句 ) 中 指定 列 的 值 进行 分 组 , 再 检索 出 满足 HAVING 子 句 中 组 
条 件 表达 式 的 组 ， 按 SELECT 子 句 后 面 的 列 名 或 列表 达 式 输出 。ORDER 子 句 (排序 子 句 ) 
用 来 对 输出 的 记录 进行 排序 。 

SELECT 语句 既 可 以 完成 简单 的 单 表 查询 ， 也 可 以 完成 复杂 的 连接 查询 和 苦 套 查询 。 
下 面 以 WeiBo 数据 库 中 的 表 为 例 介绍 SELECT 语句 的 各 种 用 法 。 

1. 简单 的 SELECT 语句 


简单 的 SELECT 语句 格式 如 下 。 


SELECT 目标 表 的 列 名 或 列表 达 式 集合 
FROM 基本 表 或 (和 ) 视 图 集合 


例如 : 


SELECT user_name, user telephone, user_sex 
FROM Z USER 
这 个 SELECT 语句 将 返回 用 户 表 中 的 选 定 字段 (user_name,user_telphone,user_sex) 的 数 
据 。 如 果 需 要 返回 用 户 表 中 的 所 有 字段 ， 则 可 以 使 用 星 号 (*) 来 代替 所 有 列 名 ， 如 下 语句 : 
SELECT * 
FROM Z USER 
使 用 TOP 关键 字 可 以 只 显示 一 组 记录 中 前 面 的 几 个 记录 ， 它 紧 跟 在 SELECT 关键 字 
的 后 面 ， 下 面 的 例子 中 将 返回 用 户 表 Z_USER 的 前 10 条 记录 。 


SELECT TOP 10 * 
FROM Z USER 


2. 消除 重复 行 


两 个 本 来 并 不 完全 相同 的 元 组 ， 投 影 到 指定 的 某 些 列 后 ， 可 能 变 成 相同 的 行 了 ， 这 时 
可 以 使 用 DISTINCT 关键 字 来 消除 重复 的 行 。 
例如 ， 以 下 SQL 语句 查询 Z_USER 表 中 的 user sex 列 : 


SELECT user sexFROM Z_USER: 


由 于 用 户 的 性 别 只 有 “ 男 ”或 “ 女 ” 两 种 取 值 ， 所 以 ， 上 述 的 SQL 语句 执行 后 将 会 包 
含 许多 重复 的 行 ， 如 果 想 消除 重复 的 行 ， 可 以 通过 指定 DISTINCT 关键 字 来 实现 : 


SELECT DISTINCT user sexFROM Z_USER; 


如 果 没 有 指定 DISTINCT 关键 字 ， 则 默认 为 ALL， 即 保留 结果 表 中 所 有 重复 的 行 。 
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3. 重 命名 输出 列 

在 创建 表 时 ， 为 方便 计算 和 查询 ， 一 般 将 字段 名 称 定义 为 英文 名 。 但 是 ， 当 需要 将 表 
显示 出 来 时 ， 对 于 中 国人 来 说 ， 英 文字 段 名 称 就 不 如 中 文字 段 名 称 直观 。SQL 提供 了 AS 
关键 字 来 对 字段 重新 命名 。 例 如 ， 以 下 将 输出 的 user name 字段 重新 命名 为 “姓名 ”， 将 
user_sex 字段 重新 命名 为 “性 别 ”: 


SELECT user name AS 姓名, user_sex AS 性 别 
FROM Z USER 


注意 : 
在 SQL 查询 语句 中 使 用 AS 对 表 的 字段 重新 命名 ， 只 改 输出 ， 并 未 改变 该 表 在 设计 视 
图 中 的 字段 名 称 。 


AS 关键 字 不 仅 可 以 对 存在 的 字段 命名 ， 也 可 以 对 不 存在 的 字段 重 命名 ， 一 般 在 以 下 
情况 中 使 用 。 
(1) 所 涉及 的 表 的 字段 名 很 长 或 者 想 把 英文 字段 名 改 为 中 文字 段 名 ， 使 字段 在 结果 集 
中 更 容易 查看 和 处 理 。 
(2) 查询 产生 了 某 些 计算 字段 、 合 并 字段 等 原本 不 存在 的 字段 ， 需 要 命名 。 
(3) 多 表 查 询 中 在 两 个 或 者 多 个 表 中 存在 重复 的 字段 名 。 
另外 ,在 SELECT 语句 中 数字 类 型 的 字段 之 间 还 支持 加 、 减 、 乘 和 除 (+ 一 x/) 基 本 算术 
操作 。 而 字符 型 字段 之 间 也 支持 加 操作 ， 其 结果 是 将 两 个 字符 串 合 并 在 一 起 ， 下 面 的 语句 
演示 了 如 何 把 用 户 表 中 的 user name 和 user address 连接 起 来 : 
SELECT user name + user address AS 用 户 信 息 
FROM Z USER 


4. 使 用 合计 函数 
为 了 进一步 为 用 户 提 供 方便 的 操作 途径 ， 增 强 检索 功能 ，SQL 提供 了 许多 合计 函数 ， 
也 称 为 聚集 函数 。 主 要 的 合计 函数 如 表 5-6 所 示 。 


表 5-6 SQL 提供 的 合计 函数 


ĉit AA 功能 
COUNT([IDISTINCTIALL]*) 统计 元 组 个 数 
COUNT(IDISTINCTIALL]< 列 名 >) 统计 一 列 中 值 的 个 数 
SUM([DISTINCTIALL]< 列 名 >) 计算 一 列 值 的 总 和 (此 列 必须 是 数值 型 ) 
AVG([DISTINCTIALL]< 列 名 >) 计算 一 列 值 的 平均 值 (此 列 必须 是 数值 型 ) 
MAX([DISTINCTIALL]< 列 名 >) 求 一 列 值 中 的 最 大 值 
MIN([DISTINCTIALL]< 列 名 >) 求 一 列 值 中 的 最 小 值 


如 果 指定 DISTINCT 关键 字 ， 则 表示 在 计算 时 要 取消 指定 列 中 的 重复 值 。 如 果 不 指定 
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DISTINCT 关键 字 或 指定 ALL 关键 字 (ALL 为 默认 值 )， 则 表示 不 取消 重复 值 。 
以 下 SQL 语句 查询 Z USER 表 中 的 总 用 户 数 : 


SELECT COUNT(*) 
FROM Z_USER: 
说 明 : 


在 合计 函数 遇 到 空 值 时 ， 除 Count(*) 外 ， 都 跳 过 空 值 而 只 处 理 非 空 值 。 


5. 使 用 WHERE 子 句 筛选 数据 
在 同样 的 检索 情况 下 ， 使 用 WHERE 子 句 可 以 指定 查询 条 件 ， 缩 小 数据 检索 范围 ， 例 
如 , 要 在 用 户 表 Z_USER 中 检索 出 姓名 user_name=' 葛 萌 萌 ' 的 记录 , 可 以 使 用 如 下 SQL 语句 : 
SELECT * 


FROM Z USER 
WHERE user name = ' 葛 萌 荫 ' 


说 明 : 
“ 葛 萌 萌 ” 被 两 个 单 引号 括 了 起 来 ， 是 为 了 表示 该 值 是 文本 (字符 串 ) 类 型 。 


当 WHERE 子 句 的 约束 条 件 比 较 多 或 者 比较 复杂 时 ， 可 以 在 WHERE 子 句 中 使 用 一 些 
比较 运行 符 和 逻辑 运算 符 ， 如 表 5-7 所 示 。 


表 5-7_ 常 用 的 查询 条 件 


查询 条 件 谓 词 
比较 =，>，<，>=，<=，!=，<>，!>，!<，Not+ 上 述 比 较 运算 符 
确定 范围 BETWEEN AND, NOT BETWEEN AND 
确定 集合 IN, NOTIN 
字符 匹配 LIKE, NOT LIKE 
空 值 IS NULL, IS NOT NULL 
多 重 条 件 (逻辑 运算 ) AND，OR，NOT 


LIKE 操作 符 是 针对 字符 串 的 ， 作 用 是 确定 给 定 的 字符 串 是 否 与 指定 的 模式 匹配 。 模 
式 可 以 包含 常规 字符 和 通配符 字符 。 模 式 匹配 过 程 中 ， 常 规 字符 必须 与 字符 串 中 指定 的 字 
符 完全 匹配 。 可 以 使 用 字符 串 的 任意 片段 匹配 通配符 。 与 使 用 = 和 != 字符 串 比较 运算 符 
相 比 ， 使 用 通配符 可 使 LIKE 运算 符 更 加 灵活 。 

例如 ， 要 查询 Z USER 表 中 所 有 姓 “ 赵 ”的 男性 用 户 ，SQL 语句 如 下 : 


SELECT * 
FROM Z USER 
WHERE user name LIKE ' 赵 %' AND user sex= ' 男 ! 
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6. ORDER BY 子 句 
在 用 WHERE 子 句 定义 了 筛选 要 求 后 ， 如 果 想 改变 从 数据 库 返 回 的 数据 顺序 ， 可 以 使 
ORDER BY 子 句 。ORDER BY 子 名 出 现在 SQL 语句 的 末尾 ， 可 包含 一 个 或 多 个 列 名 或 
表达 式 , 也 可 以 包括 ASC 或 DESC 来 决定 记录 是 以 升序 (ASC, 默认 关键 字 ) 或 以 降序 (使 用 
DESC) 排 列 ， 如 果 没 有 指定 排序 常数 ， 将 默认 以 升序 方式 排列 ， 其 语法 格式 如 下 : 
ORDER BY 字段 或 者 是 字段 集合 排序 常数 


例如 , 将 Z_USER 表 中 所 有 性 别 为 “ 女 ” 的 数据 按 姓 名 进行 降序 排列 ，SQL 语句 如 下 : 


SELECT * 

FROM Z USER 

WHERE user sex=' 女 ' 
ORDERBY user name DESC 


7. GROUP BY 子 句 


GROUP BY 子 句 将 查询 结果 按 某 一 列 或 多 列 的 值 分 组 ， 值 相等 的 为 一 组 。 
对 查询 结果 分 组 的 目的 是 为 了 细 化 聚集 函数 的 作用 对 象 。 如 果 未 对 查询 结果 进行 分 
组 ， 聚 集 函 数 将 作用 于 整个 查询 结果 。 分 组 后 聚集 函数 将 作用 于 每 一 个 组 ， 即 每 一 个 组 都 
有 一 个 函数 值 。 
以 下 SQL 语句 将 查询 每 个 用 户 收 听 的 用 户 总 数 : 
SELECT user_id, COUNT(user id) AS 收听 用 户 数 


FROMZ USER FUN 
GROUP BY user id 


该 语句 对 查询 结果 按 user_id 进行 分 组 ， 所 有 具有 相同 user id 值 的 元 组 为 一 组 ， 然 后 
对 每 一 组 作用 聚集 函数 COUNT 计算 ， 以 求 得 该 组 的 总 数 。 
如 果 分 组 后 还 要 求 按 一 定 的 条 件 对 这 些 组 进行 筛选 ， 最 终 只 输出 满足 指定 条 件 的 组 ， 
可 以 使 用 HAVING 关键 字 指 定 筛选 条 件 。 
例如 ， 查 询 收听 用 户 总 数 大 于 50 的 用 户 ID 信息 : 
SELECT user_id, COUNT(user id) AS 收听 用 户 数 
FROM Z USER FUN 


GROUP BY user id 
HAVING (COUNT(user id) > 50) 


技巧 : 

WHERE 子 句 与 HAVING 关键 字 的 区 别 在 于 作用 对 象 不 同 。WHERE 子 句 作用 于 表 或 
视图 ， 从 中 选择 满足 条 件 的 元 组 。HAVING 关键 字 则 作用 于 组 ， 从 中 选择 满足 条 件 的 组 。 

8. 连接 查询 

连接 查询 也 叫 多 表 查 询 ， 在 实际 应 用 过 程 中 经 常 要 同时 从 两 个 表 或 者 两 个 以 上 的 表 中 
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检索 数据 。 连 接 查 询 允 许 通过 指定 表 中 某 个 或 者 某 些 列 作为 连接 条 件 ， 同 时 从 两 个 表 或 者 
多 个 表 中 检索 数据 。 

连接 查询 可 以 使 用 两 种 连接 语法 形式 , 一 种 是 把 连接 条 件 写 在 FROM 子 句 中, 另 一 种 
是 把 连接 条 件 写 在 WHERE 子 句 中 。 

连接 条 件 写 在 WHERE 子 句 中 的 语法 形式 非常 简单 ， 在 数据 库 程序 中 经 常用 到 ， 语 法 
格式 如 下 : 


SELECT 表 名 .字段 名 , 表 名 .字段 名 …. 
FROM 表 名 , 表 名 … 
WHERE 连接 条 件 AND 搜索 条 件 


连接 条 件 一 般 是 表 与 表 之 间 联 系 字 段 的 表达 式 ， 例 如 ， 下 面 的 例子 将 查询 “ 葛 萌 萌 ” 
发 表 的 所 有 信息 : 
SELECT user name, T.* 


FROMZ USER,Z MESSAGE T 
WHERE Z USER.user id=T.user id AND Z USER.user name=' 葛 荫 荫 ' 


技巧 : 
上 述 查 询 中 ， 数 据 表 Z MESSAGE 使 用 了 别名 T， 数 据 表 别 名 功能 能 够 大 大 减少 手工 
输入 量 ， 使 代码 简洁 明了 。 


连接 条 件 写 在 FROM 子 句 中 的 形式 中 需要 用 到 JOIN 关键 字 。 
SQL-92 标准 所 定义 的 FROM 子 句 的 连接 语法 格式 如 下 : 
FROM join table join_type join_table 
[ON (join _condition)] 


其 中 ，join_table 指出 参与 连接 操作 的 表 名 ， 连 接 可 以 对 同一 个 表 操 作 ， 也 可 以 对 多 个 
表 操 作 ， 对 同一 个 表 操作 的 连接 又 称 做 自 连 接 ， join_type 指出 连接 类 型 ， 可 分 为 3 种 : 内 
连接 、 外 连接 和 交叉 连接 。 

(1) 内 连接 (INNER JOIN) 使 用 比较 运算 符 进行 表 间 某 ( 些 ) 列 数据 的 比较 操作 , 并 列 出 这 
些 表 中 与 连接 条 件 相 匹配 的 数据 行 。 根据 所 使 用 的 比较 方式 不 同 , 内 连接 又 分 为 等 值 连接 、 
自然 连接 和 不 等 连接 3 种 。 

(2) 外 连接 分 为 左 外 连接 (LEFT OUTER JOIN 或 LEFT JOIN)、 右 外 连接 (RIGHT 
OUTER JOIN 或 RIGHT JOIN) 和 全 外 连接 (FULL OUTER JOIN 或 FULL JOIN)3 种 。 与 内 连 
接 不 同 的 是 , 外 连接 不 只 列 出 与 连接 条 件 相 匹配 的 行 , 而 是 列 出 左 表 ( 左 外 连接 时 )、 右 表 ( 右 
外 连接 时 ) 或 两 个 表 ( 全 外 连接 时 ) 中 所 有 符合 搜索 条 件 的 数据 行 。 

G) 交叉 连接 (CROSS JOIN) 没 有 WHERE 子 句 , 它 返 回 连 接 表 中 所 有 数据 行 的 销 卡 尔 

职 ， 其 结果 集合 中 的 数据 行 数 等 于 第 一 个 表 中 符合 查询 条 件 的 数据 行 数 乘 以 第 二 个 表 中 符 
合 查 询 条 件 的 数据 行 数 。 

连接 操作 中 的 ON Goin_condition) 子 句 指出 连接 条 件 ， 它 由 被 连接 表 中 的 列 和 比较 运 

算 符 以 及 逻辑 运算 符 等 构成 。 
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注意 : 
无 论 哪 种 连接 都 不 能 对 text. ntext 和 image 数据 类 型 进行 直接 连接 ， 但 可 以 对 这 三 种 
列 进行 间接 连接 。 


例如 ， 上 述 查 询 “ 葛 萌 萌 ”发 表 的 所 有 信息 的 SQL 语句 ， 可 以 转换 为 如 下 内 连接 : 


SELECT Z USER.user name, Z MESSAGE.* 
FROM Z_USER INNER JOIN 

Z MESSAGE ON Z _USER.user_id = Z MESSAGE.user id 
WHERE (Z_USER.user_name = ' 锡 萌 萌 ) 


9. 联合 查询 


UNION 运算 符 可 以 将 两 个 或 两 个 以 上 的 SELECT 语句 的 查询 结果 集合 合并 成 一 个 结 
果 集 合 显示 ， 即 执行 联合 查询 。UNION 的 语法 格式 如 下 : 
select _statement 


UNION [ALL] selectstatement 
[UNION [ALL] selectstatement][...n] 


其 中 ，selectstatement 为 待 联合 的 SELECT 查询 语句 ，ALL 选项 表示 将 所 有 行 合并 到 
结果 集合 中 。 不 指定 该 项 时 ， 被 联合 查询 结果 集合 中 的 重复 行将 只 保留 一 行 。 
联合 查询 时 ， 查 询 结果 的 列 标题 为 第 一 个 查询 语句 的 列 标题 。 因 此 ， 要 定义 列 标题 必 
须 在 第 一 个 查询 语句 中 定义 。 要 对 联合 查询 结果 排序 时 ， 也 必须 使 用 第 一 查询 语句 中 的 列 
名 、 列 标题 或 者 列 序 号 。 
例如 ， 下 面 的 语句 将 返回 姓名 为 “ 葛 萌 萌 ” 和 “ 赵 艳 铎 ”的 用 户 信息 : 
SELECT user_id, user_name, user_sex 
FROM Z USER 
WHERE (user name = ' £ Jj ii") 
UNION 
SELECT user_id, user name, user sex 
FROM Z_USER AS Z_USER_1 
WHERE (user name = ' 赵 艳 铎 ) 


10. 子 查询 


在 SQL 中 ， 一 个 SELECT…FROM.…WHERE 语句 称 为 一 个 查询 块 。 将 一 个 查询 块 嵌 
套 在 另 一 个 查询 块 的 WHERE 子 句 或 HAVING 关键 字 的 条 件 中 的 查询 称 为 嵌 套 查询 。 

SQL 语言 允许 多 层 舱 套 查询 , 即 一 个 子 查 询 中 还 可 以 嵌 套 其 他 子 查询 。 需 要 注意 的 是 ， 
子 查询 的 SELECT 语句 中 不 能 使 用 ORDER BY 子 句 , 因为 ORDER BY 子 句 只 能 对 最 终 查 
询 结 果 进行 排序 。 

嵌 套 查询 使 得 用 多 个 简单 查询 构成 复杂 的 查询 成 为 可 能 ， 从 而 增强 了 SQL 的 查询 能 
力 。 以 层 层 嵌 套 的 方式 来 构造 程序 正 是 SQL 中 “结构 化 ”的 含义 所 在 。 
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e WA IN 谓词 的 子 查询 
在 嵌 套 查询 中 ， 子 查询 的 结果 往往 是 一 个 集合 ， 所 以 , IN 是 嵌 套 查询 中 最 经 常 使 用 的 
谓词 。 以 下 SQL 语句 查询 “小 石头 ”收听 的 所 有 用 户 的 信息 : 


SELECT user_name, user sex, user email, user address 
FROM Z USER 
WHERE (user_id IN 
(SELECT Z USER FUN fun user id 
FROM Z_USER AS Z USER_1 INNER JOIN 
Z USER FUN ON Z USER_l.user_id=Z USER FUN.user id 
WHERE (Z _USER_l.user name = ' 小 石头 7)) 
o 带 有 比较 运算 符 的 子 查 询 
带 有 比较 运算 符 的 子 查 询 是 指 父 查询 与 子 查询 之 间 用 比较 运算 符 进行 连接 。 当 用 户 能 
确切 知道 内 层 查询 返回 的 是 单 值 时 ， 可 以 用 >、<、=、>=、<=、!= 或 > 等 比较 运算 符 。 
以 下 SQL 语句 将 查询 “ 葛 萌 萌 ” 发 表 的 所 有 信息 : 
SELECT msg id, user_id, msg_content, reply_count, post_time 
FROM Z MESSAGE 
WHERE (user_id = 
(SELECT user id 
FROM Z_USER 
WHERE (user name = ' Jj Jj"))) 
o 带 有 ANY(SOME) 或 ALL 谓词 的 子 查询 
子 碍 询 返回 单 值 时 可 以 用 比较 运算 符 ， 但 返回 多 值 时 要 用 ANY( 有 的 系统 用 SOME) 或 
ALL 谓词 修饰 符 。 而 使 用 ANY 或 ALL 谓词 时 则 必须 同时 使 用 比较 运算 符 ， 其 语义 定义 如 
K 5-8 所 示 。 


表 5-8_ANY 和 比较 运算 符 组 合 


运 算 符 意 x 
>ANY 大 于 子 查询 结果 中 的 某 个 值 
>ALL 大 于 子 查询 结果 中 的 所 有 值 
<ANY 小 于 子 查 询 结果 中 的 某 个 值 
<ALL 小 于 子 查询 结果 中 的 所 有 值 
>=ANY 大 于 等 于 子 查询 结果 中 的 某 个 值 
S=ALL 大 于 等 于 子 查询 结果 中 的 所 有 值 
<=ANY 小 于 等 于 子 查询 结果 中 的 某 个 值 
<=ALL 小 于 等 于 子 查询 结果 中 的 所 有 值 
=ANY 等 于 子 查询 结果 中 的 某 个 值 
=ALL 等 于 子 查询 结果 中 的 所 有 值 
上 =( 或 二 )ANY 不 等 于 子 查询 结果 中 的 某 个 值 


二 (或 <>)ALL 不 等 于 子 查询 结果 中 的 任何 一 个 值 
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以 下 SQL 语句 查询 所 有 收听 用 户 数 小 于 最 近 24 小 时 注册 的 所 有 新 用 户 收听 用 户 数 的 
户 的 收听 情况 : 


SELECT user_id, COUNTQuser id) AS 收听 用 户 数 
FROM Z USER FUN 
GROUP BY user id 
HAVING (COUNT(user_id) < ALL 
(SELECT COUNT(user id) AS Exprl 
FROM Z USER FUN AS Z USER FUN 1 
WHERE (user_id IN 
(SELECT user_id 
FROM Z USER 
WHERE (regist_time > GETDATEO - 1))) 
GROUP BY user_id)) 


系统 在 执行 此 查询 语句 时 ， 首 先 处 理子 查询 ， 找 出 最 近 24 小 时 新 注册 的 所 有 用 户 ， 
然后 计算 出 这 些 用 户 各 的 自 收 听 用 户 数 , 构成 一 个 集合 , 最 后 , 通过 HAVING 子 句 和 <ALL 
关键 字 筛选 出 比 这 些 新 用 户 收 听 还 少 的 用 户 的 收听 用 户 数 。 


5.2.3 在 VWD 中 执行 SQL 查询 


5.2.2 节 介 绍 了 SELECT 语句 的 语法 , 现在 来 看 看 , 如 何在 VWD 中 执行 这 些 查询 语句 。 

例 5-5: 在 VWD 中 ， 通 过 SELECT 语句 查询 表 中 的 数据 。 

(1) 前 面 使 用 了 “显示 表 数 据 ” 命 令 ， 查 看 表 中 的 数据 ， 并 且 可 以 向 表 中 添加 数据 。 
这 实际 上 是 执行 的 一 个 SELECT 查询 的 结果 。 要 查看 出 现 这 一 列表 所 涉及 的 查询 ， 可 以 使 
用 “查询 设计 器 ”工具 栏 中 的 命令 按钮 。 如 果 该 工具 栏 不 可 见 ， 可 以 右 击 已 有 工具 栏 ， 并 
从 打开 的 快捷 菜单 中 选择 “查询 设计 器 ”选项 即 可 打开 ， 工具 栏 中 个 命令 按钮 的 作用 如 图 
5-17 所 示 。 


_ Ë= ENA 
Errr jhi l =J a | 更 型 四 ”| f sg lE | 站 RER] 
PAE soL 名 法] 
TENESI ENE 


图 5-17 “查询 设计 器 ”工具 栏 


D 用 户 可 以 看 到 表 数 据 窗口 ， 其 实 是 显示 的 结果 窗 格 ， 在 该 工具 栏 中 ， 单 击 “ 显 示 
关系 图 窗 格 ”、“ 显 示 条 件 窗 格 ” 和 “显示 SQL 窗 格 ” 按 钮 分 别 打开 这 些 窗口 。 则 文档 窗 
口 将 被 分 为 4 个 区 域 ， 每 个 区 域 对 应 于 一 个 窗 格 ， 如 图 5-18 所 示 。 
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其 中 的 SQL 窗 格 显示 了 用 于 检索 显示 在 结果 窗 格 中 的 SQL 语句 。 在 这 里 可 以 很 轻松 
地 修改 它 ， 以 执行 不 同 的 查询 。 

(3) 为 了 确保 SQL 语句 是 有 效 的 ， 可 单 击 工具 栏 中 的 “验证 SQL 句法 ”按钮 ， 修 正 
SQL 语句 可 能 包含 的 错误 。 然 后 单 击 “ 执 行 SQL” 按 钮 或 按 Ctrl+R 组 合 键 。 在 这 两 种 情 
况 下 ， 都 会 执行 SQL 语句 ， 并 更 新 结果 窗 格 。 


[结果 窗 格 


图 5-18 ”显示 所 有 窗 格 


(4) 除了 直接 在 “SQL 窗 格 ” 中 输入 SQL 语句 之 外 , 还 可 以 通过 “关系 图 窗 格 ” 和 “条 
件 窗 格 ” 来 控制 输出 结果 中 包含 的 字段 以 及 查询 的 过 滤 条 件 和 排序 方式 等 。 而 且 在 这 两 个 
窗 格 中 的 修改 会 马上 体现 在 SQL 窗 格 的 SQL 语 名 上。 例如， 改变 输出 列 ， 然 后 设置 排序 
条 件 和 筛选 条 件 后 ， 可 以 看 到 SQL 语句 也 相应 地 变化 了 ， 如 图 5-19 所 示 。 


username user login nser password | user_sex 


L ee nanas = 


图 5-19 改变 条 件 窗 格 自动 生成 相应 的 SQL 


(5) 再 次 按 Ctrl+R 组 合 键 或 单 击 工具 栏 中 的 “执行 SQL” 按钮 ， 结 果 窗 格 将 显示 新 的 
查询 记录 。 
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(6) 如 果 要 进行 多 表 查 询 ， 可 以 单 击 工具 栏 中 的 “添加 表 ” 按 钮 添加 所 需 的 表 。 此 时 ， 
SQL 窗 格 中 会 根据 表 之 间 的 关系 自动 生成 连接 查询 语句 ,读者 可 根据 实际 需要 进行 相应 的 
修改 。 


5.2.4 INSERT 语句 


要 将 新 记录 插入 到 表 中 ， 可 以 使 用 INSERT 语句 。 它 有 一 些 不 同 的 形式 ， 最 简单 的 形 
式 如 下 所 示 : 


INSERT INTO 表 名 
VALUES (第 一 个 字段 值 … 最 后 一 个 字段 值 ) 


其 中 ，VALUES 后 面 的 字段 值 必须 与 数据 表 中 相应 字段 所 规定 的 值得 数据 类 型 相符 ， 
和 WHERE 子 句 一 样 , 需要 将 字符 串 和 日 期 值 括 在 单 引号 中 , 但 可 以 在 SQL 语句 中 直接 输 
入 数字 和 布尔 值 。 如 果 不 想 对 某 些 字 段 进行 赋值 , 可 以 在 相应 地 位 置 上 用 空 值 NULL 替代 。 
如 果 需 要 插入 的 是 表 的 某 些 字 段 的 值 , 可 以 在 SQL 语句 中 使 用 男 一 种 INSERT 语句 进 
行 操作 ， 语 法 格式 如 下 : 
INSERT INTO 表 名 (字段 1…, 字 段 N,…) 
VALUES (第 一 个 字段 值 …, 第 N 个 字段 值 …) 


当 用 这 种 形式 向 数据 表 中 添加 新 记录 时 ， 在 关键 字 INSERT INTO 后 面 输入 所 要 添加 
的 数据 表 名 称 ， 然 后 在 括号 中 列 出 将 要 添加 新 值 的 字段 的 名 称 ， 最 后 ， 在 关键 字 VALUES 
的 后 面 按照 前 面 输入 的 列 的 顺序 对 应 地 输入 所 有 要 添加 的 记录 值 。 需 要 注意 的 是 ， 对 于 表 
中 的 非 空 列 ， 如 果 没 有 定义 默认 值 ， 必 须 显示 的 给 出 该 列 的 值 。 
例如 ， 下 面 的 语句 将 在 Z_MESSAGE 表 中 插入 一 条 新 的 记录 : 
INSERT INTO Z MESSAGE 


(user id, msg_content, reply_count,post_time) 
VALUES (1, "既然 已 移 情 ， 那 么 请 别 恋 ', 0,'2012-7-7 22:22:22") 


技巧 : 

在 VWD 的 查询 窗口 中 ， 单 击 工具 栏 中 的 “更 改 类 型 ”按钮 ， 从 弹出 的 下 拉 菜 单 中 选 
择 “ 插 入 值 ”选项 ，SQL 查询 中 的 语句 会 自动 更 新 为 INSERT 语句 的 模板 ， 可 通过 “条 件 
窗 格 ”指定 各 列 的 值 ， 或 者 直接 基于 自动 生成 的 INSERT 模板 完成 插入 语句 。 


5.25 UPDATE 语句 


UPDATE 语句 用 来 修改 数据 表 中 已 经 存在 的 数据 记录 。 它 的 基本 语法 格式 如 下 : 


UPDATE 表 名 
SET 字段 1= 值 1…, 字段 N= (Ë N, 
[WHERE 条 件 表达 式 ] 
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其 含义 是 更 新 数据 表 中 符合 WHERE 条 件 的 字段 或 字段 集合 的 值 , WHERE 条 件 是 可 选 的 。 
例如 ,下 面 的 语句 是 下 是 将 用 户 名 为 “ 葛 萌 萌 ” 的 user email 更 改 为 lovezyd@gmail.com: 


UPDATE Z USER 
SET user email = 'lovezyd@gmail.com' 
WHERE user name = ' 葛 萌 萌 ' 


上 面 的 UPDATE 语句 是 确定 值 赋 值 ， 即 为 字段 赋予 指定 的 值 。 也 可 以 基于 已 有 的 值 来 
设置 新 的 字段 值 。 例 如 ， 将 信息 表 Z MESSAGE 中 msg id 为 1 的 记录 的 reply_count 字段 
加 1， 可 以 使 用 如 下 SQL 语句 : 


UPDATE Z MESSAGE 
SET reply_count = reply_count + 1 
WHERE msg _id= 1 


与 插入 数据 一 样 ， 单 击 工具 栏 中 的 “更 改 类 型 ”按钮 ， 从 弹出 的 下 拉 菜 单 中 选择 “更 
新 ”选项 ，SQL 查询 中 的 语句 会 自动 更 新 为 UPDATE 语句 的 模板 ， 可 通过 “条 件 窗 格 ” 
或 者 直接 在 SQL 窗 格 中 输入 语句 来 完成 更 新 操作 。 


5.2.6 DELETE 语句 


DELETE 语句 用 来 删除 数据 表 中 的 记录 ， 基 本 语法 格式 如 下 : 


DELETE FROM 表 名 
[WHERE 条 件 表 达 式 ] 


与 UPDATE 语句 类 似 ，DELETE 语句 中 的 WHERE 选项 也 是 可 选 的 ， 如 果 不 限定 
WHERE 条 件 ，DELETE 语句 将 删除 数据 表 中 的 所 有 记录 ， 例 如 : 
DELETE FROM Z_USER 
这 条 语句 将 删除 用 户 表 Z USER 中 的 所 有 记录 。 如 果 并 不 想 清空 数据 表 中 所 有 记录 ， 
就 必须 注意 WHERE 子 句 的 使 用 。 


技巧 : 
单 击 工具 栏 中 的 “更 改 类 型 ”按钮 ， 从 弹出 的 下 拉 菜 单 中 选择 “删除 ”选项 ，SQL # 
询 中 的 语句 会 自动 更 新 为 DELETE 语句 的 模板 。 


5.3 使 用 ADO.NET 


ADO.NET 是 .NET Framework 提供 的 数据 访问 的 类 库 ，ADO.NET 对 Microsoft SQL 
Server, Oracle 和 XML 等 数据 源 提供 一 致 的 访问 。 应 用 程序 可 以 使 用 ADO.NET 连接 到 这 
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5.3.1 ADO.NET 概述 


ADO.NET 作为 重要 的 .NET 数据 库 应 用 程序 的 解决 方案 ， 更 多 地 显示 了 涵盖 全 面 的 设 
计 ， 而 不 仅 是 单纯 地 以 数据 库 为 中 心 ， 如 图 5-20 所 示 为 ADONET 的 架构 。 

在 ADO.NET 中 ,访问 ADO.NET 中 的 数据 源 是 由 托管 提供 程序 所 控制 的 ，ADO.NET 
架构 的 两 个 主要 组 件 是 Data Provider( 数 据 提供 者 ) 和 DataSet( 数 据 集 )。 相 应 地 可 以 把 
ADO.NET 的 基本 类 分 为 数据 提供 者 对 象 和 数据 集 对 象 。 提 供 者 对 象 可 用 于 每 一 种 类 型 的 
数据 源 ; 专用 于 提供 者 的 对 象 完成 数据 源 中 实际 的 读 取 和 写 入 工作 。 而 数据 集 对 象 则 是 将 
数据 读 入 到 内 存 中 ， 用 来 访问 和 操纵 数据 。 如 图 5-21 所 示 为 这 些 对 象 之 间 的 关系 。 


图 5-20 ADO.NET 架构 


提供 者 对 象 需要 一 个 活动 的 连接 ， 可 以 使 用 它们 先 从 数据 库 中 读 取 数 据 ， 然 后 根据 需 
要 ， 通 过 数据 集 对 象 使 用 内 存 中 的 数据 ， 也 可 以 使 用 提供 者 对 象 更 新 数据 源 中 的 数据 。 数 
据 集 对 象 以 非 连接 方式 使 用 ， 甚 至 在 数据 库 连 接 关 闭 之 后 ， 也 可 以 使 用 内 存 中 的 数据 。 


图 5-21 ADONET 类 之 间 的 关系 
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5.3.2 ”提供 者 对 象 


Data Provider 提供 了 DataSet 和 数据 中 心 (如 MS SQL Server) 之 间 的 联系 ， 同 时 也 包含 
了 存 取 数据 中 心 (数据 库 ) 的 一 系列 接口 .通过 数据 提供 者 所 提供 的 应 用 程序 编程 接口 (APD)， 
可 以 轻松 访问 各 种 数据 源 的 数据 ， 包 括 OLE DB 所 支持 的 和 ODBC 支持 的 数据 库 。 

提供 者 对 象 就 是 指 在 每 一 个 NET 数据 提供 者 中 定义 的 对 象 , 其 名 称 前 带 有 特定 提供 者 
的 名 称 。 因 此 ,用 于 OLE DB 提供 者 的 连接 对 象 就 是 OleDbConnection; 用 于 SQL Server .NET 
提供 者 的 类 就 是 SqlConnection。 

在 ADONET 中 ， 连 接 数 据 源 有 4 种 接口 ， 即 SQLClient、OracleClient 、ODBC 和 
OLEDB。 其 中 ，SQLClient 是 Microsoft SQL Server 数据 库 专 用 连接 接口 ，OracleClient 是 
Oracle 数据 库 专 用 的 连接 接口 ，ODBC 和 OLEDB 可 用 于 其 他 数据 源 的 连接 。 在 应 用 程序 
中 使 用 任何 一 种 连接 接口 时 ， 必 须 在 后 台 代 码 中 引用 对 应 的 命名 空间 ， 而 且 类 的 名 称 也 随 
之 发 生变 化 ， 如 表 5-9 所 示 。 


表 5-9 数据 连接 方式 命名 空间 与 对 应 的 类 名 称 
对 应 的 类 名 称 
System.Data.SqlClient SqlConnection、SqlCommand、SqlDataReader、SqlDataAdapter 


System.Data.Odbe OdbcConnection、OdbcCommand、OdbcDataReader、OdbcDataAdapter 
System.Data.OleDb OleDbConnection, OleDbCommand, OleDbDataReader, OleDbDataAdapter 


System.Data.OracleClientt | OracleConnection, OracleCommand. OracleDataReader, OracleData Adapter 


1. 连接 对 象 

连接 对 象 是 使 用 ADO.NET 访问 数据 库 的 第 一 个 对 象 , 它 提 供 了 到 数据 源 的 基本 连接 。 
如 果 使 用 的 数据 库 需 要 用 户 名 和 密码 ， 或 者 是 位 于 远程 网 络 服务 器 上 ， 则 连接 对 象 可 以 提 
供 建立 连接 并 登录 的 细节 。 根 据 数据 源 的 不 同 ， 连 接 对 象 有 4 种 ， 即 SqlConnection、 
OleDbConnection、OdbcConnection 和 OracleConnection。 


连接 对 象 的 常用 属性 和 方法 如 表 5-10 所 示 。 


表 5-10_ 连 接 对 象 的 常用 属性 和 方法 


属性 或 方法 描 ” 述 
该 属性 用 来 指定 连接 的 数据 源 ， 需 要 使 用 很 多 参数 : 如 Data Source 指明 数 
ConnectionString 据 源 ; Initial Catalog 指明 数据 库 ; Integrated Security 指明 集成 安全 ; User ID 
和 Password 分 别 用 于 指明 登录 账户 和 密码 等 
PEE. 该 属性 用 于 获取 在 尝试 建立 连接 时 终止 尝试 并 生成 错误 之 前 所 等 待 的 时 间 ， 


单位 为 秒 ， 默 认 值 为 15 
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属性 或 方法 描 B 
Duie 该 属性 返回 当前 数据 库 名 称 或 连接 打开 后 要 使 用 的 数据 库 名 称 ， 默 认为 空 字 
符 串 

DataSource 获取 要 连接 的 数据 源 实例 的 名 称 

Open 该 方法 用 于 打开 由 ConnectionString 属性 指定 的 数据 源 连 接 

Close 该 方法 用 于 断 开 由 ConnectionString 属性 指定 的 数据 源 连 接 


2. 命令 对 象 


命令 对 象 用 于 向 数据 源 发 出 命令 ， 命 令 对 象 可 直接 执行 SQL 语句 或 存储 过 程 , 命令 对 
象 的 CommandText 属性 就 是 要 执行 的 SQL 语句， 如 SELECT * FROM Z_ REPLY。 对 于 不 
同 的 提供 者 ,该 对 象 的 名 称 也 略 有 不 同 ,例如 ,用 于 SQL Server 的 命令 对 象 为 SqlCommand， 
用 于 ODBC 的 为 OdbcCommand, 用 于 OLE DB 的 命令 对 象 为 OleDbCommand, 用 于 Oracle 
的 命令 对 象 为 OracleCommand 。 

Command 对 象 的 常用 属性 和 方法 如 表 5-11 所 示 。 


属性 或 方法 


CommandText 


CommandTimeout 


CommandType 


Connection 


ExcuteNonQnuel 


表 5-11 Command 对 象 的 常用 属性 和 方法 
描 g 
获取 或 设置 要 对 数据 源 执行 的 SQL 语句 或 存储 过 程 
获取 或 设置 在 终止 执行 命令 的 尝试 并 生成 错误 之 前 的 等 待 时 间 ， 以 秒 
为 单位 ， 默 认 值 为 30 
获取 或 设置 CommandText 的 类 型 , 其 值 为 System.Data.CommandType 
值 之 一 ， 默 认为 Text 
获取 或 设置 Command 实例 使 用 的 Connection 对 象 
该 方法 对 连接 的 数据 库 执行 SQL 语句 并 返回 受 影响 的 行 数 
将 CommandText 发 送 到 Connection 并 生成 一 个 DataReader， 返 回 值 


ExcuteReader 

为 一 个 DataReader 对 象 

执行 查询 并 返回 查询 所 返回 的 结果 集中 的 第 一 行 第 一 列 ， 忽 略 其 他 行 
ExcuteScalar 

或 列 

将 CommandText 发 送 到 Connection 并 生成 一 个 System.Xml XmlReader 
ExcuteXmlReader 

对 象 ， 返 回 值 为 该 XmlReader 对 象 
ResetCommandTimeout 将 CommandTimeout 属性 重 置 为 默认 值 


3. CommandBuilder 对 象 
此 对 象 用 于 构建 SQL 命令 , 在 基于 单一 表 查 询 的 对 象 中 进行 数据 修改 。 对 于 不 同 的 提 


供 者 ， 该 对 象 的 名 称 分 别 为 用 于 SQL Server 的 SqlCommandBuilder， 用 于 ODBC 的 Odbc- 
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CommandBuilder, 用 于 OLE DB 的 OleDbCommandBuilder 和 用 于 Oracle 的 OracleCommand- 
Builder。 
CommandBuilder 对 象 的 常用 属性 和 方法 如 表 5-12 所 示 。 


表 5-12 CommandBuilder 对 象 的 常用 属性 和 方法 
属性 或 方法 描 B 
DataAdapter | 获取 或 设置 自动 为 其 生成 SQL 语句 的 一 个 DataAdapter 对 象 
GetUpdateCommand 获取 自动 生成 的 、 对 数据 库 执行 更 新 操作 所 需 的 Command 对 象 
获取 自动 生成 的 、 对 数据 库 执行 删除 操作 所 需 的 Command 对 象 
获取 自动 生成 的 、 对 数据 库 执行 插入 操作 所 需 的 Command 对 象 


GetDeleteCommand 


GetInsertComman 


4. DataReader 对 象 

该 对 象 用 于 从 数据 源 中 读 取 仅 能 前 向 和 只 读 的 数据 流 。 对 于 简单 地 读 取 数据 来 说 ， 此 
对 象 的 性 能 最 好 。 对 于 不 同 的 提供 者 ， 该 对 象 的 名 称 分 别 为 用 于 SQL Server 的 
SqlDataReader, 用 于 ODBC 的 OdbcDataReader, 用 于 OLE DB 的 OleDbDataReader 和 用 于 
Oracle 的 OracleDataReader。 

DataReader 对 象 的 常用 属性 和 方法 如 表 5-13 所 示 。 


表 5-13 DataReader 对 象 的 常用 属性 和 方法 


属性 或 方法 Ha £ 

FieldCount 获取 当前 行 中 的 列 数 

RecordsAffected 获取 被 更 改 、 插 入 或 删除 的 行 数 

IsClosed 指示 是 否 可 关闭 数据 读 取 器 

Close 关闭 DataReader 对 象 

GetName 获取 指定 列 的 名 称 

使 DataReader 前 进 到 下 一 条 记录 ， 如 果 存 在 多 个 行 则 返回 true， 否 则 返 
回 false 
当 读 取 批 处 理 SQL 语句 的 结果 时 ， 使 数据 读 取 器 前 进 到 下 一 个 结果 ， 如 

7 果 存在 多 个 结果 集 则 返回 hue， 否 则 返回 false 

IsDBNull 获取 一 个 值 ， 指 示 列 中 是 否 包含 不 存在 的 或 已 丢失 的 值 

GetOrdinal 在 给 定 列 名称 的 情况 下 获取 列 序号 


5. DataAdapter 对 象 


DataAdapter( 数 据 适 配器 ) 是 DataSet 和 数据 源 之 间 的 桥梁 , 可 以 执行 针对 数据 源 的 各 种 
操作 ， 包 括 更 新 变动 的 数据 、 填 充 DataSet 对 象 以 及 其 他 操作 。 对 于 不 同 的 提供 者 ， 该 对 
象 的 名 称 分 别 为 用 于 SQL Server 的 SqlDataAdapter， 用 于 ODBC 的 OdbcDataAdapter、 用 
于 OLE DB 的 OleDbAdapter 和 用 于 Oracle 的 OracleDataAdapter。 
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在 创建 DataAdapter 对 象 时 ， 可 以 直接 指定 Connection 和 Command 对 象 。 如 果 要 定义 后 
指定 属性 ， 主 要 包括 SelectCommand, InsertCommand, UpdateCommand 和 DeleteCommand 。 

DataAdapter 对 象 的 常用 方法 主要 有 如 下 3 个 。 

° Fill: 该 方法 用 来 执行 SelectCommand， 用 数据 源 的 数据 填充 DataSet 对 象 。 

© GetData: 该 方法 新 建 一 个 数据 集中 DataTable 并 填充 它 。 

e Update: 更 新 数据 集中 的 某 个 DataTable. 


533 ”数据 集 对 象 


DataSet 即 数据 集 ， 是 ADO.NET 的 断 开 式 结构 的 核心 ,是 指 内 存 中 的 数据 库 数 据 的 副 
本 , 用 于 支持 ADONET 中 的 离线 数据 的 访问 。DataSet 对 象 表 示 了 数据 库 中 的 完整 的 数据 ， 
包括 表 、 限 制 以 及 表 之 间 的 关系 。 正 是 由 于 Dataset 的 存在 ， 才 使 得 编程 人 员 在 编写 应 用 
程序 时 可 以 不 考虑 各 数据 源 之 间 的 差异 ， 从 而 使 用 统一 的 编程 接口 。 

运行 时 , 组件 可 以 交换 数据 集 。 也 就 是 说 ， 一 个 组 件 可 以 将 数据 集 传递 给 另 一 个 组 件 。 
为 了 适应 在 组 件 间 进行 数据 集 交 换 ，ADONET 使 用 了 一 个 基于 XML 的 保持 和 传递 格式 。 
ADO.NET 解决 方案 将 内 存 中 的 数据 (数据 库 ) 表 示 为 一 个 XML 文件 ， 然 后 将 这 个 XML X: 
件 发 送 给 另 一 个 组 件 。 

数据 集 对 象 位 于 System.Data 命名 空间 中 , 用 于 定义 ADO.NET 的 断 开 的 、 客 户 端的 对 
象 ， 包 括 DataSet, DataTable, DataRow, DataColumn 和 DataRelation 等 。 

用 户 可 以 使 用 DataSet 对 象 对 数据 集中 的 内 容 进行 处 理 。DataSet 对 象 允许 使 用 与 关系 
模型 一 致 的 方法 对 数据 集 的 内 容 进行 处 理 。 例 如 , DataSet 对 象 有 一 个 DataTable 对 象 集合 ， 
每 个 DataTable 对 象 都 有 行 和 列 ， 并 且 与 其 他 的 DataTable 对 象 有 关联 。 当 一 个 组 件 将 数据 
集 传 递 给 另 一 个 组 件 时 ， 接 收 组 件 将 把 接收 到 的 数据 集 物 化 为 一 个 DataSet 对 象 。 

1. DataSet 对 象 


DataSet 是 数据 集 对 象 中 的 首要 对 象 , 此 对 象 表 示 一 组 相关 表 , 在 应 用 程序 中 这 些 表 作 
为 一 个 单元 来 引用 。 例 如 ，Z_USER、Z_MESSAGE #ll Z_ REPLY 是 一 个 DataSet 中 的 3 张 
表 ， 有 了 此 对 象 ， 就 可 以 快速 从 每 一 个 表 中 获取 所 需要 的 数据 ， 当 与 服务 器 断 开 时 检查 并 
修改 数据 ， 然 后 在 另 一 个 操作 中 使 用 这 些 修改 的 数据 更 新 服务 器 。 

DataSet 允许 访问 低级 对 象 ， 这 些 对 象 代表 单独 的 表 和 关系 。 这 些 对 象 是 DataTable 对 
象 和 DataRelation 对 象 。 

DataSet 对 象 的 常用 方法 如 表 5-14 所 示 。 


表 5-14 DataSet 对 象 的 常用 方法 
属性 或 方法 描 R 
AcceptChanges | 提交 自 加 载 此 DataSet 或 上 次 调用 AcceptChanges 以 来 对 其 进行 的 所 有 更 改 


开始 初始 化 在 窗 体 上 使 用 或 由 另 一 个 组 件 使 用 的 DataSet， 初 始 化 发 生 在 运 
行 时 


BeginInit 
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GEK) 
属性 或 方法 描述 

EndInit 结束 在 窗 体 上 使 用 或 由 另 一 个 组 件 使 用 的 DataSet 的 初始 化 
Clear 通过 移 除 所 有 表 中 的 所 有 行 来 清除 所 有 数据 的 DataSet 
复制 DataSet 的 结构 ， 包 括 所 有 DataTable 架构 、 关 系 和 约束 。 不 复制 任何 

数据 

复制 DataSet 的 结构 和 数据 ， 返 回 新 的 DataSet, 具 有 与 该 DataSet 相同 的 结 
构 和 数据 
Merge 将 指定 的 Dataset 及 其 架构 合并 到 当前 Dataset 中 

获取 DataSet 的 副本 ， 该 副本 包含 自 加 载 以 来 或 上 次 调用 AcceptChanges 方 
GetChanges 


2. DataTable 对 象 
该 对 象 代表 DataSet 中 的 一 个 表 ， 如 Z USER. 


法 以 来 所 有 的 更 改 ， 可 以 对 该 副本 执行 操作 


DataTable 对 象 的 Rows 和 Columns 分 别 是 DataRow 和 DataColumn 对 象 , 可 用 于 访问 


DataTable 表 中 的 行 和 列 。 


© DataColumn 对 象 : 代表 表 中 的 一 列 ， 如 user_name 或 user login, 
© DataRow 对 象 : 代表 来 自 表 的 关联 数据 的 一 行 ， 如 Z USER 表 中 的 user id. 


user name 和 user_address 等 。 


3. DataRelation 对 象 


该 对 象 代表 通过 共享 列 而 发 生 关 系 的 两 个 表 之 间 的 关系 ， 如 Z MESSAGE 表 中 的 
user_id 列 标识 发 表 信 息 的 用 户 。 于 是 ， 可 以 创建 DataRelation 对 象 ， 通 过 共享 列 user id 


建立 Z_USER 和 Z_MESSAGE 表 之 间 的 关系 。 


5.34 使 用 ADO.NET 访问 数据 库 


ASP.NET 数据 访问 程序 的 开发 流程 有 以 下 几 个 步骤 。 


(1) 利用 Connection 对 象 创建 数据 连接 。 
(2) 利用 Command 对 象 数据 源 执行 SQL 命令 。 
(3) 利用 DataReader 对 象 读 取 数据 源 的 数据 。 


(4) DataSet 对 象 与 DataAdapter 对 象 配合 ， 完 成 数据 的 查询 和 更 新 操作 。 
为 了 让 读者 更 深刻 的 理解 ADO.NET 访问 数据 库 的 用 法 ， 下 面 将 以 具体 的 实例 来 介绍 


对 数据 的 查询 、 插 入 、 修 改 和 删除 操作 。 
1. 注册 新 用 户 


例 5-6: 新 建 一 个 ASP.NET 页 面 ， 完 成 注册 微 博 新 用 户 功能 。 
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注册 新 用 户 就 是 向 Z_USER 表 中 添加 一 条 新 记录 , 在 添加 记录 之 前 需要 判断 是 否 已 经 
存在 相同 的 用 户 登 录 名 ， 并 且 要 求 用 户 设置 的 个 人 微 博 地 址 home url 唯一 。 

(1) 启动 VWD 2010， 选 择 “文件 ”|“ 新 建 网 站 ”命令 ， 新 建 空 网 站 Chapters- 

(2) 通过 “添加 新 项 ”对 话 框 添加 一 个 名 为 Register.aspx 的 页 面 。 

G) 使 用 表格 布局 ,插入 一 个 11 行 3 列 的 表格 ， 合 并 表格 第 1 行 的 3 个 单元 格 ， 后 面 
的 第 1 列 输 入 文本 信息 ， 第 2 列 添加 相应 的 控件 ， 第 3 列 添加 验证 控件 ， 最 后 一 行 添加 2 
个 按钮 控件 ， 用 来 提交 和 取消 输入 。 最 终 的 页 面 布局 如 图 5-22 所 示 。 


注册 新 用 户 

登录 名 登录 名 不 能 为 空 
密码 请 输入 密码 
确认 密码 =s 两 次 输入 密码 不 一 到 
真实 姓名 Ea 请 输入 真实 姓名 
性 别 6 男 c 女 
个 人 神情 地 址 [ 个 人 宽 博 地 址 不 能 鸭 空 
E-mail | | 
地 址 Co 

al 
个 人 介绍 

zl 

| ma] 


图 5-22 注册 页 面 的 布局 


这 里 的 注册 页 面具 选取 了 Z USER 表 中 的 非 空 项 和 部 分 可 空 字段 要 求 用 户 输入 ,其 他 
信息 可 以 在 用 户 注册 并 成 功 登 录 后 ， 通 过 完善 个 人 资料 和 上 传 头像 等 功能 页 面 实现 。 
(4) 打开 页 面 的 后 台 代码 文件 Register.aspx.cs， 由 于 要 访问 数据 库 ,， 所 以 在 后 台 代 码 文 
件 中 需要 引入 相应 的 命名 空间 : 
using System.Data.SqlClient; 
using System.Data; 


(5) 创建 连接 对 象 时 ， 需 要 设置 连接 字符 串 属性 ConnectionString， 通 常 将 该 连接 串 配 
置 在 web.config 配置 文件 中 ， 打 开 该 文件 ， 添 加 如 下 配置 信息 


<connectionStrings> 
<add name="WeiBoConnectionString" connectionString="Data 
Source=zhao\sqlexpress;Initial Catalog=WeiBo;Integrated Security=True" 
providerName="System.Data.SqlClient" /> 
</connectionStrings> 


(6) 在 第 2 章 已 经 介绍 过 读 取 web.config 文件 中 的 配置 项 , 因此 要 先 添加 using 语句 引 
入 System.Web.Configuration: 命 名 空间 。 

(7) 接 下 来 添加 一 个 私有 方法 ， 验 证 登录 名 和 个 人 微 博 地 址 是 否 已 经 被 使 用 ， 该 方法 
有 两 个 参数 ， 第 1 个 参数 是 要 验证 的 字段 值 ， 第 2 个 参数 是 验证 类 别 ， 该 参数 有 个 默认 值 
LOGIN， 如 果 不 指定 该 参数 则 进行 登录 名 验证 ， 如 果 该 参数 为 URL， 则 进行 个 人 微 博 地 址 
验证 。 代 码 如 下 : 


第 5 章 数据 访问 与 数据 绑 定 > 175 s 


private bool doCheck(string condValue.string type="LOGIN") 
í 

bool ret = true: 

string strConn = 
WebConfigurationManager.ConnectionStrings["WeiBoConnectionString"].ConnectionString; 

SqlConnection con = new SqIConnection(strConn); 

con.Open(); 

SqlCommand cmd = new SqlCommand("SELECT * FROM Z USER WHERE user login 
= @cond_ value", con); 

if(type.Equals("URL")) 

cmd.CommandText = "SELECT * FROM Z_USER WHERE home _url = 

@cond value"; 

cmd.Parameters.AddWithValue("(@cond value", condValue); 

SqlDataReader reader = cmd.ExecuteReader(); 

while (reader.ReadO)/ 如 果 有 结果 表明 记录 已 存在 

í 

ret= false; 

} 

cmd = null: 

con.Close(); 

con = null; 

return ret; 


} 
(8) 为 “提交 ”按钮 添加 单 击 事件 处 理 程序 ， 代 码 如 下 : 


protected void ButtonSubmit Click(object sender, EventArgs e) 
{ 
if (!doCheck(TextBoxLogin.Text)) 
{ 
Page.ClientScript.RegisterClientScriptBlock(this.GetType(, "success", "alert(\" 该 登 
录 名 已 存在 \"); ", true); 


return; 
} 
if (!doCheck(TextBoxHomeUrl.Text."URL")) 
li 


Page.ClientScript.RegisterClientScriptBlock(this.GetType(), "success", "alert\" 个 人 
微 博 地 址 已 被 使 用 \"); ", true); 
return; 
} 
string strConn = 
WebConfiguration Manager.ConnectionStrings["WeiBoConnectionString"].ConnectionString: 
SqlConnection con = new SqIConnection(strConn); 
con.Open(); 
SqlCommand cmd = new SqlCommand("INSERT INTO Z USER(user name,"+ 
"user login,user password,user sex,home url,user email,user info," + 
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"user addressTegist time) values(@user name,(@user login,(@user password," + 
"@user sex.Q@home urLQuser emailLQuser info,(@user _ address,Qregist_time)"， 
con); 
cmd. Parameters. AddWithValue("(@@user name", TextBoxName.Text); 
cmd.Parameters.AddWithValue("@user_login", TextBoxLogin.Text); 
cmd.Parameters.AddWithValue("(@user_password", TextBoxPassword. Text); 
cmd. Parameters. AddWithValue("(@user_sex", RadioButtonList1.SelectedValue); 
cmd.Parameters.AddWithValue("Q@home url", TextBoxHomeUrl. Text); 
cmd. Parameters. AddWithValue("(@@user email", TextBoxEmail.Text); 
cmd.Parameters.AddWithValue("@user_info", TextBoxInfo.Text); 
cmd. Parameters. AddWithValue("(@@user_address", TextBoxAddress.Text); 
cmd.Parameters.AddWithValue("@regist_time", DateTime.Now); 
int count = cmd.ExecuteNonQuery(); 
if (count 一 1)// 如 果 为 1 表示 插入 1 条 记录 
Page.ClientScript. RegisterClientScriptBlock(this.GetType(), "success", "alert(v' 2 $ 
你 ， 注 册 成 功 \"); ", true); 
else 
Page.ClientScript. RegisterClientScriptBlock(this.GetType(), "success", "alert(\" 注 册 
失败 \"); ", true); 


cmd = null: 

con.Close(); 

con = null; 

Response.Redirect("Login.aspx"); 
} 


(9) 编译 并 运行 程序 ， 在 浏览 器 中 打开 Registeraspx。 输 入 注册 信息 ， 如 果 必 填 项 没有 
输入 ， 验 证 控件 会 给 出 相应 的 提示 信息 。 输 入 完整 信息 后 ， 如 图 5-23 所 示 ， 单 击 “ 提 交 ” 
按钮 ， 将 验证 登录 名 和 个 人 微 博 地 址 是 否 可 用 ， 如 果 可 用 即 可 注册 成 功 ， 并 跳 转 到 登录 页 
面 Login.aspx。 此 时 浏览 器 会 提示 找 不 到 资源 ， 因 为 还 没有 创建 该 页 面 ， 本 章 下 一 个 例子 
就 是 实现 微 博 的 登录 页 面 Login.aspx。 

提示 : 

注册 成 功 后 ， 读 者 可 到 数据 库 中 查看 Z_USER 表 ， 看 是 否 新 增 了 记录 。 
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注册 新 用 户 


[CE EEC 了 


图 5-23 注册 页 面 效 果 
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2. 登录 微 博 


例 5-7: 新 建 一 个 ASPNET 页 面 ， 实 现 微 博 用 户 的 登录 功能 ， 用 户 登 录 成 功 后 显示 用 
户 的 基本 信息 、 用 户 收听 和 被 收听 的 总 数 以 及 用 户 发 表 的 信息 数 ( 只 显示 数量 ,不 显示 具体 
内 容 ， 待 学 习 了 数据 控件 后 将 显示 信息 列表 )。 

(1) 启动 VWD 2010， 打 开 网 站 Chapter5。 

(2) 通过 “添加 新 项 ”对 话 框 添加 一 个 名 为 Login.aspx 的 页 面 。 

(3) 在 页 面 中 添加 一 个 Panel 控件 , 该 控件 中 用 表格 布局 , 添加 相应 的 控件 用 于 输入 登 
录 名 和 密码 , 并 为 两 个 文本 框 分 别 添加 必 选 项 验证 控件 , Panell 控件 的 布局 如 图 5-24 所 示 。 

(4) 添加 另 一 个 Panel 控件 Panel2, 用 于 登录 成 功 后 显示 用 户 相 关 信 息 。 控件 中 包括 用 
户头 像 和 基本 信息 ， 布 局 如 图 5-25 所 示 。 


[SanelpaneEl 
收听 听众 信息 
Label0ther LabelFun Labelllsg 
"Tp pq EPP wiwa  —— əÜ*s-—m—aww——— 姓名 LabelName 
登录 名 厂 ” SAP S Email LabelEmail 
密码 la Nen 所 在 地 LabelAddress 
电话 LabelTelephone 
Bilan 个 人 简介 LabelInfo 
s] 
图 5-24 Panell 控件 布局 图 5-25”Panel2 控件 布局 
(5) 打开 页 面 的 后 台 代码 文件 Login.aspx.cs， 添 加 using 语句 ， 引 入 所 需 的 命名 空间 : 


using System. Web.Configuration; 
using System. Data.SqlClient; 
using System.Data; 


(6) 为 “登录 ”按钮 添加 单 击 事件 处 理 程序 ， 代 码 如 下 : 


protected void Buttonl_Click(object sender, EventArgs e) 
{ 
string strConn = 
WebConfiguration Manager.ConnectionStrings["WeiBoConnectionString"].ConnectionString; 
SqlConnection con = new SqIConnection(strConn); 
DataSet ds = new DataSet(); 
con.Open(); 
SqlDataAdapter sqld = new SqlDataAdapter("SELECT user id,user name FROM Z USER 
WHERE "+ 
" user login = @user_login AND user password = @password", con); 
sqld.SelectCommand.Parameters.AddWithValue("@user_login", TextBoxLogin. Text); 
sqld.SelectCommand.Parameters.AddWithValue("@password", TextBoxPassword. Text); 
sqld.Fill(ds, "user");// 用 Fill 方法 填充 DataSet 
DataTable dTable = ds.Tables["user"];// 将 数据 表 的 数据 复制 到 DataTable 对 象 
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DataRowCollection rows = dTable Rows:// 获 取 数 据 行 
1f (rows.Count > 0) 
d 
Session["user id"] = rows[0][0]; 
Session["user name"] = rows[0][1]; 
ShowInfo(Int32.Parse(rows[0][0].ToString0)); 


else 


Page.ClientScript. RegisterClientScriptBlock(this.GetType(), "success", "alert(\" 用 户 
名 密码 错误 \"); ", true); 
} 
con.Close(); 
con = null; 


} 


上 述 代 码 与 注册 页 面 所 用 的 方法 略 有 不 同 ， 这 里 使 用 的 是 DataAdapter 对 象 和 DataSet 
对 象 来 读 取 数据 集中 的 数据 。 感 兴趣 的 读者 也 可 以 将 其 改 为 用 DataReader 对 象 实现 。 
(7) 登录 成 功 后 ， 将 用 户 的 ID 和 姓名 存放 到 Session 变量 中 ， 然 后 调用 私有 函数 
ShowInfo 更 新 Panel2 中 的 控件 信息 并 显示 ， 相 应 的 代码 如 下 所 示 : 


private void ShowInfo(int user_id) 
{ 
Panell.Visible = false; 
Panel2.Visible = true; 
string strConn = 
WebConfiguration Manager.ConnectionStrings["WeiBoConnectionString"].ConnectionString; 
SqlConnection con = new SqlConnection(strConn); 
con.Open(); 
SqlCommand cmd = new SqlCommand("SELECT 
user name,user email,user address,user info" 十 
"user telephone FROM Z USER WHERE user id = "+user id.ToString(), con); 
SqlDataReader reader = cmd.ExecuteReader(); 
让 (reader.Read0)/ 如 果 有 结果 表明 记录 已 存在 
LabelName.Text=reader.GetString(0): 
if (!reader.IsDBNull(1)) 
LabelEmail.Text = reader.GetString(1); 
else 
LabelEmail.Text = ""; 
if (!reader.IsDBNull(2)) 
LabelAddress.Text = reader.GetString(2); 
else 
LabelAddress.Text = ""; 
if (!reader.IsDBNu1I(3)) 
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Labellnfo.Text = reader.GetString(3); 
else 
Labellnfo.Text = "": 
if (!reader IsDBNu1I(4)) 
LabelTelephone.Text = reader.GetString(4); 
else 
LabelTelephone. Text = ""; 
} 
cmd.CommandText = "SELECT COUNT(*) FROM Z_ USER FUN WHERE user_id =" + 
user_id.ToString(); 
reader.Close(); 
reader = cmd.ExecuteReader(); 
if (reader.Read()) 
LabelOther.Text = reader.GetInt32(0).ToString(): 
cmd.CommandText = "SELECT COUNT(*) FROM Z_USER_FUN WHERE fun user id = 
" + user_id.ToString(); 
reader.Close(); 
reader = cmd.ExecuteReader(); 
if (reader.Read()) 
LabelFun.Text = reader.GetInt32(0).ToString(); 
cmd.CommandText = "SELECT COUNT(*) FROM Z MESSAGE WHERE user_id =" + 
user_id.ToString(); 
reader.Close(); 
reader = cmd.ExecuteReader(); 
if (reader.Read()) 
LabelMsg.Text = reader.GetInt32(0).ToStringO; 
reader.Close(); 
cmd = null; 
con.Close(); 
con = null; 
ShowPhoto(user_id);// 显 示 头 像 
} 


该 方法 通过 几 次 查询 操作 获取 Panel2 中 需要 显示 的 信息 , 最 后 ,调用 ShowPhoto 方法 
显示 头像 信息 。 

(8) ShowPhoto 方法 用 于 显示 用 户头 像 ， 如 果 用 户 未 设置 头像 ， 则 根据 用 户 的 性 别 显示 
一 个 默认 的 头像 ， 代 码 如 下 : 


private void ShowPhoto(int user_id) 
{ 
string strConn = 
WebConfigurationManager.ConnectionStrings["WeiBoConnectionString"].ConnectionString: 
SqIConnection con = new SqIConnection(strConn); 
con.Open(); 
SqlCommand cmd = new SqlCommand("SELECT user sex,user photo FROM Z USER"+ 
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" WHERE user 1d="+user _id.ToString(), con); 
SqlDataReader reader = cmd.ExecuteReader(); 
让 (readerRead0)/ 如 果 有 结果 表明 记录 已 存在 
{ 
if (!reader.IsDBNull(1)) 
Imagel.ImageUrl = "~/touxiang.aspx?userid=" + user _id.ToString(); 
else 
JImagel.ImageUrl = reader.GetString(0).Equals(" 男 ") ? "~/images/boy.gif" : 
"~/images/girl.gif"; 
} 
reader.Close(); 
cmd = null: 
con.Close(); 
con = null; 


) 


从 代码 可 以 看 出 ， 显 示 头 像 指定 Image 控件 的 ImageUrl 为 一 个 URL 地 址 ， 所 以 还 需 
要 添加 这 个 页 面 。 

(9) 通过 “添加 新 项 ”对 话 框 添加 名 为 touxiang.aspx 的 页 面 ， 在 后 台 代码 文件 中 添加 
using 语句 引入 所 需 的 命名 空间 ， 然 后 在 页 面 的 Load 事件 中 添加 如 下 代码 : 


protected void Page Load(object sender, EventArgs e) 
{ 
string strConn = 
WebConfigurationManager.ConnectionStrings["WeiBoConnectionString"].ConnectionString; 
SqlConnection con = new SqlConnection(strConn); 
con.Open(); 
SqlCommand cmd = new SqICommand("SELECT user photo FROM Z_USER" + 
" WHERE user_id = " + RequestQueryString["userid"].ToString0, con); 
SqlDataReader reader = cmd.ExecuteReader(); 
让 (readerRead0)/ 如 果 有 结果 表明 记录 已 存在 
{ 
if (Ireader.IsDBNull(0)) 
{ 
byte[] data = reader.GetSqIBytes(0).Buffer; 
Response.ContentType = "image/gif"; 
Response.OutputStream. Write(data, 0, data.Length); 


j 
reader.Close(); 
cmd = null; 
con.Close(); 


con = null; 
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因为 数据 库 中 存放 的 用 户头 像 格式 是 二 进 制 数据 ， 所 以 从 数据 库 中 读 取 到 图 像 信息 后 
通过 指定 ContentType 来 指定 touxiang.aspx 传送 到 客户 端的 是 一 个 图 像 数据 。 

(10) 返回 到 Login.aspx 页 面 ， 在 页 面 的 Load 事件 中 判断 用 户 是 否 已 登录 ， 如 果 未 登 
录 则 显示 Panell ， 隐 藏 Panel12， 否 则 显示 Panel2， 隐 藏 Panell 。 代 码 如 下 : 


protected void Page Load(object sender, EventArgs e) 
t 
if (Session["user id"] != null) 


ShowInfo(Int32.Parse(Session["user_id"].ToString())); 
else 
{ 

Panell.Visible = true; 

Panel2.Visible = false; 


) 


(11) 编译 并 运行 程序 ， 在 浏览 器 中 打开 登录 页 面 ， 如 图 5-26 所 示 。 输 入 正确 的 登录 
名 和 密码 后 ， 将 显示 用 户 的 相关 信息 ， 如 图 5-27 所 示 。 


C énwatp://localhost:llll/Chapter5/Login.... 
09- e leher DOE 
ZPD WO HV RAD IAU MMW 
BRR |E hto:// ochesti 1. la-a- o” 
Æ http://1ocalhost:1111/Chapter5/L... [- OE 辐 
go- [n localhost x] > 
文件 中 MED SEV WERO IAD WHW X 7” aA 
BRR |Æ http://localhost: 11. ü- z 收听 bE | 信息 
2 2 1 
登录 名 |yanduozh 姓名 起 相公 = 
ET [eceseeee i ea a 
所 在 地 ARTERE 
EESLI 电话 15910806516 
个 人 简介 RARAY 
interet ae Rios ~ E n- Aow + 
图 5-26 登录 页 面 图 5-27 登录 成 功 页 面 


3. 维护 个 人 信息 


例 5-8: 对 于 登录 成 功 的 用 户 ， 提 供 修改 个 人 信息 的 功能 。 包 括 上 传 头 像 ， 修 改 除 登 
录 名 、 注 册 时 间 和 个 人 微 博 地 址 之 外 的 其 他 信息 。 

(1) 启动 VWD 2010， 打 开 网 站 Chapter5。 

(2) 通过 “添加 新 项 ”对 话 框 添加 一 个 名 为 Modify.aspx 的 页 面 。 

(3) 用 户 访 问 修 改 个 人 信息 页 面 时 ， 应 该 是 已 经 登录 成 功 后 ， 所 以 该 页 首先 要 显示 当 
前 登录 用 户 的 原 有 信息 。 通 过 表格 布局 方式 布局 页 面 ， 添 加 相应 的 控件 显示 用 户 信 息 ， 页 
面 设计 如 图 5-28 所 示 。 

(4) 切换 到 页 面 的 后 台 代码 文件 ， 添 加 using 语句 引入 访问 数据 库 所 需 的 命名 空间 。 

(5) 在 页 面 的 Load 事件 中 添加 代码 ， 加 载 用 户 的 已 有 信息 并 显示 。 代 码 如 下 : 
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protected void Page Load(object sender, EventArgs e) 


{ 
if (!Page.IsPostBack) 
{ 
Calendar1.Visible = false; 
if (Session["user id"] != null) 
ShowInfo(mnt32.Parse(Session["user id"].ToStringO)): 
else 
í 
Response.Redirect("—/Login.aspx"); 
} 
} 
} 
private void ShowInfo(int user_id) 
{ 
string strConn = 


WebConfigurationManager.ConnectionStrings["WeiBoConnectionString"].ConnectionString; 
SqlConnection con = new SqlConnection(strConn); 
con.Open(); 
SqlCommand cmd = new SqlCommand("SELECT 
user_name,user email.user_address.user_info.user birthday" + 
"user telephone,user sex.user photo FROM Z_USER WHERE user_id = " + 
user _id.ToString(), con); 
SqlDataReader reader = cmd.ExecuteReader(); 
让 (reader.Read0)// 如 果 有 结果 表明 记录 已 存在 
{ 
TextBoxName.Text = reader.GetString(0); 
if (!reader.IsDBNull(1)) 
TextBoxEmail.Text = reader.GetString(1); 
else 
TextBoxEmail.Text = ""; 
if (!reader.IsDBNu1I(2)) 
TextBoxAddress.Text = reader.GetString(2); 
else 
TextBoxAddress.Text = ""; 
if (!reader.IsDBNu1I(3)) 
TextBoxInfo.Text = reader.GetString(3); 
else 
TextBoxInfo.Text = ""; 
if (!reader.IsDBNull(4)) 
TextBoxBirthday.Text = reader.GetDateTime(4).ToString0; 
else 
TextBoxInfo.Text = "": 
if (!reader.IsDBNu1I(5)) 
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TextBoxTelephone.Text = reader.GetString(5); 
else 
TextBoxTelephone.Text = "": 
RadioButtonList1.SelectedValue = reader.GetString(6); 
if (!reader.IsDBNu1I(7)) 
Imagel.ImageUrl = "—/touxiang.aspx?userid=" + user_id.ToString(); 
else 
JImagel.ImageUrl = reader.GetString(6).Equals(" 男 ") ? "—/images/boy.gif" : 
"~/images/girl.gif"; 
} 
reader.Close(); 
cmd = null: 
con.Close(); 
con = null; 


) 


(6) 用 于 选择 生日 的 Calendar 控件 默认 是 不 可 见 的 ， 当 单 击 “ 打 开 日 历 ” 链 接 按钮 时 ， 
将 显示 Calendar 控件 供用 户 选择 日 期 ， 选 择 生日 后 ， 将 选 定 日 期 保存 到 “生日 ”文本 框 中 
同时 隐藏 Calendar 控件 。 相 应 的 代码 如 下 : 


protected void LinkButton1_Click(object sender, EventArgs e) 


{ 

Calendar1.Visible = true; 
} 
protected void Calendar1_SelectionChanged(object sender, EventArgs e) 
{ 

TextBoxBirthday.Text = Calendar1.SelectedDate.ToString(): 

if(! (TextBoxBirthday.Text=="")) 

Calendar1.Visible = false; 

) 


(7) 修改 个 人 资料 需要 进行 密码 验证 ， 如 果 验 证 通过 则 把 用 户 提交 的 新 数据 保存 至 数 
据 库 ， 添 加 “提交 ”按钮 的 单 击 事件 处 理 程序 ， 代 码 如 下 


protected void ButtonModify_Click(object sender, EventArgs e) 
t 

if (Session["user id"] != null) 

$ 


if (TextBoxName.Text = "") 
{ 
Page.ClientScript.RegisterClientScriptBlock(this.GetType(), "success", "alert" 
姓名 不 能 为 空 \); ", true); 
return; 
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if(CheckPassword(Int32.Parse(Session["user_id"].ToString0), TextBoxPassword.Text)) 
ModifyInfo(Int32.Parse(Session["user_id"].ToString0)); 
else 
Page.ClientScript.RegisterClientScriptBlock(this.GetType(), "success", "alert(\" 
密码 错误 ,不 允许 修改 \"); ", true); 
} 
else 
{ 
Page.ClientScript.RegisterClientScriptBlock(this.GetType(), "success", "alert(\" 会 话 
已 过 期 ， 请 重新 登录 \"); ", true); 
Response.Redirect("~/Login.aspx"); 


} 
} 
private bool CheckPassword(int user id,string pass) 
{ 


bool ret = false; 
string strConn = 
WebConfiguration Manager.ConnectionStrings["WeiBoConnectionString"].ConnectionString; 

SqlConnection con = new SqlConnection(strConn); 

con.Open(); 

SqlCommand cmd = new SqICommand("SELECT user name FROM Z_USER WHERE 

user id=" 
+user_id.ToString() +" and user password='" + pass +""", con); 

SqlDataReader reader = cmd.ExecuteReader(); 

逊 (readerRead0)/ 如 果 有 结果 表明 验证 通过 

{ 
ret =true; 

) 

cmd = null: 

con.Close(); 

con = null: 

return ret; 

} 
private void ModifyInfo(int user_id) 
Ú 
string strConn = 
WebConfigurationManager.ConnectionStrings["WeiBoConnectionString"].ConnectionString: 

SqlConnection con = new SqlConnection(strConn); 

con.Open(); 

SqlTransaction tran = con.BeginTransaction(); 

SqlCommand cmd = new SqICommand("UPDATE Z USER SET user name = @name" 
+" user sex=(@sex ,user_email=@email ,user_address=@address ,user_info=(@info" 
+" ,user_telephone=(@telephone .user_birthday=(@birthday WHERE user id="+ 

user id.ToString(), con); 


第 5 章 数据 访问 与 数据 绑 定 “185。 


cmd.Transaction = tran; 
cmd. Parameters. AddWithValue("@@name", TextBoxName.Text); 
cmd.Parameters.AddWithValue("@sex", RadioButtonList1.SelectedValue); 
cmd. Parameters. AddWithValue("(@email", TextBoxEmail.Text); 
cmd.Parameters.AddWithValue("(@address", TextBoxAddress.Text); 
cmd.Parameters.AddWithValue("(@info", TextBoxInfo.Text); 
cmd.Parameters.AddWithValue("(@telephone", TextBoxTelephone.Text); 
if(TextBoxBirthday.Text=="")// 如 果 没 设置 生日 ,需要 使 用 DBNull 
cmd.Parameters.AddWithValue("@birthday", DBNull.Value); 
else 
cmd.Parameters.AddWithValue("(@birthday", TextBoxBirthday.Text); 
try 
d 
int count = cmd.ExecuteNonQuery(); 
if (FileUpload1.HasFile) 
í 
byte[] data = new byte[FileUpload1.FileContent.Length + 1]: 
FileUpload1.FileContent.Read(data, 0, (int)FileUpload1.FileContent.Length); 
cmd.CommandText = "UPDATE Z USER SET user photo = @user_photo 


WHERE user_id=" 
+ user_id.ToString0; 
cmd.Parameters.AddWithValue("(@user_photo", data); 

) 
count = cmd.ExecuteNonQuery(): 
tran.Commit(); 

) 

catch (Exception ex) 

{ 
tran.Rollback(); 

} 

finally 

{ 
cmd = null; 


con.Close(); 
con = null; 


} 
Response.Redirect(Request.RawUrl); 


说 明 : 

在 执行 修改 操作 时 ， 分 为 两 步 。 首 先 修改 除 头 像 之 外 的 信息 ， 然 后 判断 是 否 上 传 了 头 
像 ， 如 果 上 传 了 就 更 新 头像 ， 这 两 次 更 新 操作 需要 放 在 数据 库 的 一 个 事物 中 执行 ， 如 果 其 
中 一 个 执行 失败 ， 那 么 就 回 滚 整个 事物 。 
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在 ASP.NET 中 ， 可 以 使 用 Connection 和 Transaction 对 象 开始 、 提 交 和 回 深 事 务 。 具 
体 步 骤 如 下 。 
e 调用 Connection 对 象 的 BeginTransaction 方法 来 标记 事务 的 开始 , BeginTransaction 
方法 返回 对 Transaction 的 引用 。 
e 将 Transaction 对 象 赋 给 Command 的 Transaction 属性 。 
e 执行 事务 操作 。 
e° 如 果 事 务 操作 成 功 ， 使 用 Transaction 对 象 的 Commit 方法 提交 事务 ， 否 则 ， 使 用 
Rollback 方法 回 滚 事务 。 
(8) 打开 例 5-7 中 的 登录 页 面 ， 在 Panel2 面板 中 显示 头像 的 Image 控件 旁边 添加 一 个 
超 链接 控件 ， 用 于 指向 Modify.aspx 页 面 ， 如 图 5-29 所 示 。 
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inse | as] 


© 
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24 25 26 27 28 29 30 


46 |1 2 3 q $ 6 f Label0ther LabelFun Labelllsg 
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15 16 17 18 19 2% 2 ; : 
22 23 24 25 2% 2 28 Email LabelEmail 
29 0 M 1 2 3 4 所 在 地 LabelAddress 
个 人 介绍 习 电话 LabelTelephone 
g, | R 个 人 简介 LabelInfo 
图 5-28 页面 布 局 图 5-29 ”添加 超 链接 控件 


(9) 编译 并 运行 程序 ， 在 浏览 器 中 打开 Modify.aspx 页 面 ， 由 于 还 没有 登录 ， 所 以 页 面 
将 跳 转 到 Login.aspx， 登 录 成 功 后 ， 单 击 “ 维 护 个 人 信息 ”链接 进入 Modify.aspx 页 面 ， 如 
图 5-30 所 示 。 

(10) 直接 编辑 要 修改 的 项 ， 如 果 要 上 传 头像 ， 则 单 击 “ 浏 览 ” 按 钮 ， 选 择 头 像 文 件 ， 
最 后 输入 密码 ， 单 击 “ 提 交 ” 按 钮 ， 完 成 修改 操作 ， 如 图 5-31 所 示 。 
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KI 5-30 Modify.aspx 页 面 效果 图 5-31 修改 个 人 信息 
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54 数据 绑 定 与 数据 控件 


在 5.3 节 介 绍 了 如 何 通 过 ADO.NET 访问 数据 库 ， 在 读 取 到 数据 后 ， 只 是 通过 简单 的 
控件 来 显示 这 些 数 据 ， 当 数据 比较 多 时 ， 这 种 方式 显然 难以 处 理 。 下 面 将 学 习 如 何 利用 
ASP.NET 提供 的 控件 来 呈现 数据 。 首 先 介绍 单 值 绑 定 和 列表 控件 的 数据 绑 定 过 程 ， 然 后 介 
绍 GridView 等 复杂 数据 绑 定 控件 的 基本 用 法 。 


5.4.1 数据 绑 定 概述 


Web 系统 的 一 个 典型 的 特征 是 后 台 对 数据 的 访问 和 处 理 与 前 台数 据 的 显示 分 离 ， 而 前 
台 显 示 是 通过 HTML 来 实现 的 。 一 种 将 数据 呈现 的 最 直接 的 方式 是 将 需要 显示 的 数据 和 
HTML 标记 拼接 成 字符 串 并 输出 ， 但 这 种 方案 的 缺点 也 是 显而易见 的 ， 不 但 复杂 而 且 难 以 
重用 ， 尤 其 是 有 大 宗 数据 需要 处 理 时 。 为 了 简化 开发 过 程 ，ASP.NET 环境 中 提供 了 多 种 不 
同 的 服务 器 端 控件 来 帮助 程序 员 快 速 高 效 地 完成 数据 的 呈现 。 

这 些 用 于 数据 呈现 的 ASP.NET 控件 ， 集 成 了 常见 的 数据 显示 框架 和 数据 处 理 功能 ， 
在 使 用 时 只 需 设 置 某 些 属 性 ， 并 将 需要 显示 的 数据 交付 给 控件 ， 控 件 就 可 以 帮助 用 户 按照 
固定 的 样式 (例如 表格 )， 或 通过 模板 自 定 义 样式 将 一 系列 数据 呈现 出 来 ， 同 时 还 自动 继承 
某 些 内 置 的 数据 处 理 功能 ， 如 排序 和 分 页 等 。 这 些 控件 被 称 为 数据 绑 定 控 件 ， 而 将 数据 交 
付 给 数据 绑 定 控件 的 过 程 就 称 为 数据 绑 定 。 

数据 绑 定 控件 本 质 上 依然 是 通过 HTML 来 呈现 数据 , 只 不 过 按照 某 种 样式 生成 HTML 
框架 并 将 数据 填 入 其 中 的 工作 由 控件 自动 完成 了 ， 一 些 复杂 的 数据 绑 定 控件 还 提供 了 大 量 
的 功能 帮助 用 户 对 数据 进行 进一步 操作 ， 如 排序 、 过 滤 、 新 增 、 修 改 和 删除 等 ， 因 而 使 得 
数据 呈现 的 过 程 变 得 简单 而 灵活 。 
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ml] 


数据 绑 定 实际 上 是 在 HTML 标记 中 或 服务 器 控件 中 设置 要 显示 数据 的 过 程 。 对 于 页 面 
中 的 HTML 标记 ， 可 以 通过 直接 嵌入 数据 或 绑 定 表达 式 来 设置 要 显示 的 数据 ， 而 对 于 服务 
器 控件 来 说 ， 通 常 通过 设置 控件 属性 或 指定 数据 源 来 完成 数据 的 绑 定 ， 并 控制 其 呈现 的 样 
式 。 常 用 的 绑 定 表达 式 具 有 以 下 形式 : <%#XXX%>， 绑 定 表达 式 可 以 直接 嵌入 到 前 台 页 面 
代码 中 去 ， 通 常用 于 HTML 标记 中 的 数据 显示 或 单 值 控件 数据 设置 ， 如 Label、TextBox 
等 。 而 对 于 列表 控件 (如 DropDownList、CheckBoxLisb， 以 及 后 面 要 着 重 介绍 的 复杂 数据 
绑 定 控件 则 常 采用 设置 数据 源 的 方式 完成 数据 呈现 。 

1. 单 值 绑 定 

单 值 绑 定 其 实 就 是 实现 动态 文本 的 一 种 方式 。 为 了 实现 单 值 绑 定 ， 可 影响 页 面 中 添加 
一 些 特殊 的 绑 定 表达 式 。 主 要 有 以 下 几 种 数据 绑 定 表达 式 。 
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© <%= XXX %>: 内 联 引用 方式 ， 可 以 引用 C# 代 码 。 

e <%# XXX %>: 可 以 引用 .cs 文件 中 的 字段 ， 但 该 字段 必须 初始 化 后 ， 初 始 化 工作 
可 在 页 面 的 Load 事件 中 使 用 Page.DataBind 的 方法 来 实现 。 

© <% $XXX %>: 可 以 引用 web.config 文件 中 预定 义 的 字段 或 者 已 注册 的 类 。 

© <%# Eval(XXX) %>: 当 一 个 ASP.NET 控件 位 于 一 个 数据 绑 定 模板 中 时 ， 可 以 使 用 
Eval() 方 法 将 其 某 个 属性 与 数据 源 中 当前 数据 对 象 的 某 个 属性 相 绑 定 。Eval 方法 提 
供 了 一 个 单 向 的 只 读 的 数据 值 。 这 就 是 说 ， 数 据 是 从 “数据 源 ” 对 象 单 向 传送 给 模 
板 中 的 控件 ， 且 没有 办 法 修改 数据 源 对 象 中 的 数据 。 

© <%# Bind(XXX) %>: 当 需 要 修改 数据 源 中 的 数据 时 ， 通 常 采用 Bind0) 方 法 实现 这 
一 功能 。 

例如 ， 下 面 的 数据 绑 定 表达 式 都 是 有 效 的 : 
<%# DateTime.Now %> 


<%# 3+(6*number) %> ”// 其 中 ，number 是 Web 页 后 置 代 码 类 中 的 public 或 protected 变量 
<% $connectionStrings:WeiBoConnectionString %> // 引 用 web.config 中 的 数据 库 连 接 字符 串 


单 值 绑 定 有 如 下 两 个 缺点 。 

(1) 数据 绑 定 代 码 与 定义 用 户 界 面 的 代码 混合 在 一 起 。 

(2) 代码 过 于 分 散 。 正 是 由 于 这 两 个 缺点 才 造 成 不 方便 管理 页 面 和 代码 ， 所 以 应 尽量 
少 用 单 值 绑 定 。 

2. 多 值 绑 定 

多 值 绑 定 通常 与 列表 控件 以 及 复杂 的 数据 控件 一 起 工作 ， 可 以 把 多 条 数据 一 次 绑 定 到 
这 些 控件 中 。 

多 值 绑 定 的 步骤 如 下 。 

(1) 把 存储 数据 的 数据 对 象 绑 定 到 列表 控件 或 数据 控件 的 DataSource 属性 。 

(2) 调用 控件 或 者 当前 页 面 的 DataBind() 方 法 。 

为 了 创建 多 值 绑 定 , 需要 使 用 支持 数据 绑 定 的 控件 , ASP.NET 提供 了 一 系列 这 类 控件 ， 
这 些 控件 如 下 。 

o 列表 控件 : ListBox、DropDownList、CheckBoxList 和 RadioButtonList 等 。 

© HtmlSelect 控件 : 这 是 一 个 HTML 控件 ， 类 似 于 ListBox 控件 。 

e 复杂 数据 控件 : GridView、DetailsView、FormView 和 ListView 等 。 


543 ”数据 控件 简介 
为 了 有 效 处 理 系统 中 的 数据 ，ASP NET 工具 箱 的 “数据 ” 类别 中 提供 了 两 组 数据 感知 


控件 , 数据 源 控件 和 数据 绑 定 控件 。 数据 源 控件 用 于 从 数据 源 (如 数据 库 或 XML 文件 ) 中 检 
索 数据 ， 然 后 将 这 一 数据 提供 给 数据 绑 定 控件 ， 数 据 绑 定 控件 可 用 于 显示 和 编辑 数据 。 
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i; 


数据 源 控件 


数据 源 控件 用 于 连接 数据 源 、 从 数据 源 中 读 取 数 据 以 及 把 数据 写 入 数据 源 。 数 据 源 控 


件 不 呈现 任何 用 户 界 面 ， 而 是 充当 特定 数据 源 与 ASP.NET 网 页 上 的 其 他 控件 之 间 的 桥梁 。 
数据 源 控件 实现 了 各 种 数据 检索 和 修改 功能 ， 其 中 包括 查询 、 排 序 、 分 页 、 筛 选 、 更 新 、 
删除 以 及 插入 等 。 

在 工具 箱 的 “数据 ”类 别 下 包含 了 7 个 不 同 的 数据 源 控 件 和 1 个 增 件 。 


ObjectDataSource 控件 : 具有 数据 检索 和 更 新 功能 的 中 间 层 对 象 ， 允 许 使 用 业务 对 
象 或 其 他 类 ， 并 可 创建 依赖 中 间 层 对 象 管理 数据 的 Web 应 用 程序 。 

SqlDataSource 控件 : 用 来 访问 存储 在 关系 数据 库 中 的 数据 源 ， 包 括 Microsoft SQL 
Server, Oracle, OLE DB 和 ODBC。 当 该 控件 与 SQL Server 一 起 使 用 时 支持 高 级 
缓存 功能 ; 当 数 据 源 作为 DataSet 对 象 返 回 时 , 该 控件 还 支持 排序 、 筛选 和 分 页 功能 。 
AccessDataSource 控件 : 用 于 在 Web 页 面 中 显示 Microsoft Access 数据 库 的 数据 。 
它 非 常 简单 ， 在 某 种 程度 上 类 似 于 SqlDataSource 控件 ， 因 为 它 允 许 处 理 来 自 数据 
库 的 数据 。 但 不 同 之 处 在 于 它 只 针对 Microsoft Access 数据 库 进行 优化 。 
XmlDataSource 控件 ， 主要 用 于 绑 定 分 层 的 、 基 于 XML 的 数据 ， 该 控件 支持 使 用 
XPath 表达 式 来 实现 筛选 功能 ， 并 允许 对 数据 应 用 XSLT 转换 ， 此 外 ， 还 允许 通过 
保存 更 改 后 的 XML 文档 来 更 新 数据 。 

SiteMapDataSource 控件 : 该 控件 结合 导航 控件 实现 站 点 导航 功能 ， 第 3 章 在 介绍 
导航 控件 时 曾 介绍 过 如 何 使 用 SiteMapDataSource。 

EntityDataSource 控件 : EntityDataSource 控件 之 于 EF(Entity Framework) 就 像 
SqlDataSource 控件 之 于 基于 SQL 的 数据 源 ， 它 提供 了 一 个 声明 性 的 方法 来 访问 模 
型 。 和 SqlDataSource 控件 一 样 ，EntityDataSource 提供 了 对 CRUD 操作 的 轻松 访 
问 ， 另 外 使 数据 排序 和 筛选 也 变 得 非常 简单 。EntityDataSource 通过 LINQ to EF fë 
供 了 对 底层 SQL Server 数据 库 的 完全 访问 。 

LinqDataSource 控件 : 用 作 LINQ to SQL 的 数据 源 。LINQ to SQL 是 一 种 类 似 于 
EF( 将 在 第 6 章 介绍 ) 的 技术 。 KA Microsoft 现在 大 力 推广 的 是 EF, 而 不 是 LINQ to 
SQL， 所 以 本 书 不 讨论 该 控件 。 

QueryExtender 控件 : 用 作 LinqDataSource 和 EntityDataSource 控件 的 增 件 , 因为 它 
可 以 用 来 创建 丰富 的 过 滤 界 面 ， 以 便 能 够 搜索 特定 的 数据 ， 而 不 必 手 动 编写 大 量 
代码 。 


本 章 将 重点 介绍 SqlDataSource 控 件 ,SqlDataSource 控 件 使 用 ADO.NET 类 与 ADONET 
支持 的 任何 数据 库 进行 交互 。 使 用 该 控件 ， 可 以 在 ASP.NET 页 面 中 访问 和 操作 数据 ， 而 
无 须 直接 使 用 ADO.NET 类 ， 只 需 提 供用 于 连接 到 数据 库 的 连接 字符 串 ， 并 定义 使 用 数据 
的 SQL 语句 或 存储 过 程 即 可 。 在 运行 时 ，SqlDataSource 控件 会 自动 打开 数据 库 连 接 ， 执 
行 SQL 语句 或 存储 过 程 ， 返 回 指定 数据 ， 然 后 关闭 连接 。 

例 5-9: 使 用 数据 源 控件 和 数据 绑 定 初始 化 CheckBoxList 控件 。 

(1) 启动 VWD 2010， 打 开 网 站 Chapter5。 
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(2) 通过 “添加 新 项 ”对 话 框 添加 一 个 名 为 FindUser.aspx 的 页 面 。 
(3) 切换 到 页 面 的 “设计 ”视图 ， 添 加 几 个 用 于 输入 查询 条 件 的 文本 框 控 件 ， 然 后 添 
加 一 个 “查询 ”按钮 和 一 个 CheckBoxList 控件 用 于 显示 查询 结果 ， 页 面 布局 如 图 5-32 所 示 。 
(4) 在 工具 箱 的 “数据 ”类 别 中 双击 SqlDataSource 控件 ， 将 添加 该 控件 并 打开 控件 的 
“任务 ”面板 ， 单 击 “ 配 置 数据 源 ”选项 ， 如 图 5-33 所 示 。 


姓名 


所 在 地 
| =] 
mæt Doo PAA 
ame l mamm 
厂 未 绑 定 - 
图 5-32 页 面 布局 图 5-33 添加 SqlDataSource 控件 


(5) 此 时 将 打开 “配置 数据 源 ” 向 导 对 话 框 ， 第 一 步 是 选择 数据 连接 ， 因 为 前 面 已 经 
添加 了 数据 连接 ， 所 以 在 此 可 以 在 下 拉 列 表 中 直接 选择 ， 如 果 下 拉 列 表 中 没有 ， 可 以 单 击 
“新 建 连 接 ” 按 钮 添加 数据 连接 。 这 里 选择 web.config 已 经 添加 的 数据 库 连 接 串 
WeiBoConnectionString， 单 击 “连接 字符 串 ” 前 面 的 加 号 ， 可 以 查看 该 连接 生成 的 连接 字 
符 串 ， 如 图 5-34 所 示 。 


f — SqlDataSourcel 
T 选择 您 的 数据 连接 
应 用 程序 连接 数 疾 库 应 使 用 哪个 数据 连接 (r)? 
Data Source=zhao\sqlexpress;Initial Catalog-WeiBo;Integrated Security=True 
tpe 完成 
图 5-34 选择 数据 连接 
如 果 选 择 的 是 数据 连接 ， 而 该 连接 串 还 没有 保存 到 web.config 文件 中 ， 则 单 击 “ 下 一 


步 ” 按 钮 ， 将 打开 如 图 5-35 所 示 的 “将 连接 字符 串 保 存 到 应 用 程序 配置 文件 中 ”对 话 框 。 
选中 “是 ， 将 此 连接 另存 为 ” 复 选 框 ， 即 可 将 其 保存 到 web.config 文件 中 。 
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图 5-35 “将 连接 字符 串 保存 到 应 用 程序 配置 文件 中 ”对 话 框 


(6) 单 击 “下 一 步 ”按钮 ， 打 开 如 图 5-36 所 示 的 “配置 Select 语句 ”对 话 框 。 在 该 对 
话 框 中 可 以 选择 需要 的 表 和 列 ， 也 可 以 增加 WHERE 子 句 和 ORDER BY 子 句 ， 还 可 以 单 
击 “ 高 级 ”按钮 进行 高 级 SQL 生成 选项 设置 。 这 里 选择 Z USER 表 和 其 中 的 几 个 字段 。 
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图 5-36 “配置 Select 语句 ”对 话 框 


(7) 单 击 WHERE 按钮 ， 打 开 如 图 5-37 所 示 的 “添加 WHERE 子 句 ”对 话 框 ， 在 此 设 
置 查询 条 件 ， 共 设置 两 个 查询 条 件 ， 分 别 是 user_name 和 user_address， 其 值 为 LIKE 相应 
控件 的 值 ， 如 图 5-37 所 示 。 
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图 5-37 “添加 WHERE 子 句 ”对 话 框 
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(8) 添加 完 两 个 查询 条 件 后 ， 单 击 “ 确 定 ” 按 钮 ， 返 回 “ 配 置 Select 语句 ”对 话 框 ， 

在 此 对 话 框 中 将 显示 生成 的 SELECT 语句 ， 如 图 5-38 所 示 。 
iso S) 


T 配置 select 语句 


希望 各 何 从 数 磊 库 中 检索 数 固 ? 


〇 指定 自 定义 sy, BIEHN O 
O 指定 来 委 表 吉 讽 四 A T 
ZRD 
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图 5-38 “配置 Select 语句 ”对 话 框 中 显示 生成 的 SELECT 语句 


(9) 单 击 “ 下 一 步 ” 按 钮 ， 打 开 如 图 5-39 所 示 的 “测试 查询 ”对 话 框 ， 单 击 “ 测 试 查 
询 ” 按 钮 ， 将 弹出 “参数 值 编辑 器 ”对 话 框 ， 输 入 一 些 查询 参数 ， 单 击 “ 确 定 ” 按 钮 即 可 
显示 查询 结果 。 
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图 5-39 “测试 查询 ”对 话 杠 


(10) 单 击 “ 完 成 ”按钮 ， 完 成 数据 源 的 配置 。 切 换 到 “ 源 ” 视 图 ， 可 以 看 到 生成 的 代 
人 码 如 下 所 示 : 


<asp:SqlDataSource ID="SqlDataSource1" runat="server" 
ConnectionString="<%$ ConnectionStrings:WeiBoConnectionString %>" 
SelectCommand="SELECT [user id]. [user login]. [user name]. [user address] FROM 
[Z USER] WHERE (([user name] LIKE '%' + @user name + '%') AND ([user address] LIKE '%' + 
(@user_address + '%'))"> 
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<SelectParameters> 
<asp:ControlParameter ControllD="TextBoxName" Name="user name" 
PropertyName="Text" Type="String" /> 
<asp:ControlParameter ControllD="TextBox Address" Name="user_address" 
PropertyName="Text" Type="String" /> 
</SelectParameters> 
</asp:SqlDataSource> 


(11) 在 “属性 ”窗口 中 设置 CheckBoxList 控件 的 数据 绑 定 相 关 的 属性 ， 包 括 
DataSourceID 、DataMember、DataTextField 和 DataValueField， 如 图 5-40 所 示 。 
(12) 双击 “查询 ”按钮 ， 在 其 单 击 事件 中 添加 如 下 代码 ， 实 现 数据 绑 定 。 


protected void Button1_Click(object sender, EventArgs e) 


{ 
CheckBoxListl.DataBind(); 


3: 
(13) 编译 并 运行 程序 ， 在 浏览 器 中 打开 FindUser.aspx 页 面 ， 输 入 查询 条 件 ， 单 击 “ 碍 
询 ” 按 钮 ， 将 显示 模糊 查询 结果 ， 如 图 5-41 所 示 。 
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图 5-40 设置 数据 绑 定 相关 的 属性 图 5-41 模糊 查询 结果 绑 定 到 CheckBoxList 控件 


2. 数据 绑 定 控件 


使 用 数据 绑 定 控件 可 以 在 Web 页 面 上 显示 和 编辑 数据 。 在 VWD 2010 工具 箱 的 “ 数 
据 ” 类 别 中 有 7 个 数据 绑 定 控件 。 其 中 ，GridView、DataList、ListView 和 Repeater 都 可 以 
同时 显示 多 条 记录 ， 而 DetailsView 和 FormView 设计 为 一 次 显示 一 条 记录 ，DataPager 是 
为 ListView 控件 提供 分 页 功能 的 辅助 控件 。 
o GridView 控件 : 这 是 一 个 功能 非常 多 的 控件 ， 它 支持 自动 分 页 (记录 被 划分 到 多 个 
“页 面 ” 中 )、 排 序 、 编 辑 、 删 除 和 选择 。 它 像 一 个 带 有 行 和 列 的 电子 表格 那样 呈 
现 数据 ,其 中 每 行 包 含 一 条 完整 的 记录 。 尽管 有 许多 种 可 以 样式 化 这 些 行 和 控件 外 
观 的 方法 ， 但 不 能 从 根本 上 改变 表现 数据 的 方式 。 另 外 ，GridView 并 不 允许 直接 
在 底层 数据 源 中 插入 记录 。 
e DataList 控件 : 该 控件 不 仅 可 以 像 GridView 那样 以 行 表现 数据 记录 ， 也 可 以 以 列 
的 形式 表现 ， 从 而 可 以 创建 一 种 矩阵 形式 的 数据 表现 方法 。 另 外 ， 它 也 允许 通过 一 
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组 模板 定义 数据 的 外 观 。 不 过 ， 它 不 支持 分 页 和 排序 ， 不 允许 插入 新 记录 或 更 新 、 
删除 已 有 记录 。 

© Repeater 控件 : 该 控件 在 输出 到 浏览 器 的 HTML 方面 提供 了 最 大 的 灵活 性 ， 因 为 
该 控件 本 身 并 不 添加 任何 HTML 到 页 面 输出 中 。 因 此 ， 它 常用 于 HTML 有 序列 表 
或 无 序列 表 (<ol> 和 <ul>) 以 及 其 他 列表 形式 。 此 控件 可 以 通过 控件 提供 的 大 量 模板 
定义 整个 客户 端 标记 。 不 过 ， 它 没有 分 页 、 排 序 和 修改 数据 的 内 置 功 能 。 

© ListView 控件 : 该 控件 是 在 ASP.NET 3.5 中 引入 的 ， 它 最 好 地 合并 了 GridView, 
DataList 和 Repeaters ASP.NET 4 中 对 ListView 做 出 了 一 些 改 动 , 使 它 更 易于 使 用 。 
类 似 于 GridView， 它 支持 数据 编辑 、 删 除 和 分 页 ， 像 DataList 那样 ， 它 支持 多 列 
和 多 行 布局 ， 而 且 还 像 Repeater 那样 允许 完全 控制 控件 生成 的 标记 。 

© DetailsView 控件 和 FormView 控件 类 似 ， 它 们 都 只 能 一 次 显示 一 条 记录 。 
DetailsView 使 用 内 置 的 表格 格式 显示 数据 ， 而 FormView 使 用 模板 来 定义 数据 的 
外 观 。 

e FormView 控件 : ASP.NET 4 中 对 FormView 添加 了 一 个 新 的 RenderOuterTable 属 
性 。 当 把 这 个 属性 设 为 True( 默 认 值 为 False) 时 , 控件 不 会 生成 包装 的 HTML <table> 
元 素 。 这 样 就 会 生成 更 少 的 代码 和 更 清晰 的 HTML. 

© DataPager 控件 : 该 控件 可 以 在 其 他 控件 上 分 页 。 目 前 ， 它 只 能 用 于 扩展 ListView 
控件 ， 但 随 着 NET Framework 未 来 版 本 的 发 布 ， 这 一 情况 将 会 改善 。 

3. 其 他 数据 控件 


工具 箱 中 “数据 ”类 别 中 还 有 一 个 Chart 控件 。 它 最 初 是 作为 Visual Studio 2008 的 一 
个 增 件 发 布 的 ， 但 是 现在 已 经 完全 集成 到 了 Visual Studio 2010 中 。 它 用 来 绘制 从 简单 的 条 
形 图 到 3D 饼 图 和 折线 图 的 各 种 图 形 。 该 控件 不 在 本 书 讨论 范围 之 内 ， 所 以 这 里 不 再 介绍 。 


544 ”以 主 - 从 表 形 式 显 示 数 据 


数据 绑 定 控件 已 经 介绍 过 了 ， 有 的 可 以 同时 显示 多 条 记录 ， 而 有 的 一 次 只 显示 一 条 记 
录 ， 下 面 就 使 用 这 两 类 控件 以 主 - 从 表 形 式 显 示 数 据 。 

例 5-10: 使 用 GridView 和 DetailsView 控件 以 主 - 从 表 的 形式 显示 信息 表 Z MESSAGE 
和 用 户 表 Z_USER 中 的 数据 。 

(1) 启动 VWD 2010， 打 开 网 站 Chapter5。 

(2) 通过 “添加 新 项 ”对 话 框 添加 一 个 名 为 ShowMsg.aspx 的 页 面 。 

(3) 切换 到 页 面 的 “设计 ”视图 , 添加 一 个 GridView 到 窗 体 中 , 将 自动 打开 “GridView 
任务 ”面板 ， 从 “选择 数据 源 ” 下 拉 列 表 中 选择 “< 新 建 数 据 源 >” 选 项 ， 如 图 5-42 所 示 。 

(4) 在 打开 的 “数据 源 配置 向 导 ” 对 话 框 中 选择 数据 源 类 型 为 “SQL 数据 库 ”， 如 图 
5-43 所 示 ， 单 击 “ 确 定 ” 按 钮 。 
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图 5-42 添加 GridView 控件 并 配置 数据 源 图 5-43 “数据 源 配置 向 导 ” 对 话 框 


接 下 来 的 步骤 与 例 5-9 中 创建 数据 源 的 方法 类 似 ， 不 同 的 是 ， 这 里 选择 的 表 是 
Z MESSAGE 表 ， 字 段 选择“*”， 即 表 中 的 所 有 列 。 生 成 的 数据 源 代码 如 下 所 示 : 
<asp:SqlDataSource ID="SqlDataSourcel" runat="server" 


ConnectionString="<%$ ConnectionStrings: WeiBoConnectionString %>" 
SelectCommand="SELECT * FROM [Z MESSAGE]"></asp:SqlDataSource> 


(5) 在 “GridView 任务 ”面板 中 选择 “编辑 列 ” 选 项 ， 打 开 “ 字 段 ” 对 话 框 ， 可 以 在 
该 对 话 框 中 设置 GridView 控件 显示 的 字段 。 在 “ 选 定 的 字段 ”列表 中 ， 将 每 个 字段 的 
HeaderText 属性 都 改 为 中 文 ， 然 后 ， 在 “可 用 字段 ”中 将 CommandField 下 面 的 命令 按钮 
通过 “添加 ”按钮 ， 添 加 到 选 定 的 字段 中 ， 如 图 5-44 所 示 。 
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图 5-44 “字段 ”对 话 框 


(6) 选中 “GridView 任务 ”面板 中 的 “启用 分 页 ”和 “启用 排序 ” 复 选 框 ， 在 “属性 ” 
面板 中 设置 控件 的 DataKeyNames 属性 为 msg_id,user id. 

(7) 通过 “GridView 任务 ”面板 中 的 “自动 套用 格式 ”选项 为 控件 指定 一 个 好 看 的 
外 观 。 

(8) 在 GridView 控件 的 下 方 添加 一 个 DetailsView 控件 , 为 DetailsView 控件 新 建 数据 
源 ， 在 “配置 Select 语句 ”一 步 中 选项 Z USER 表 中 除 用 户 密码 和 用 户头 像 之 外 的 其 他 字 
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段 ， 然 后 单 击 WHERE 按钮 ， 打 开 “ 添 加 WHERE 子 句 ”对 话 框 ， 设 置 userid 列 的 值 为 
控件 GridView1， 如 图 5-45 所 示 ， 生 成 的 数据 源 代码 如 下 : 


<asp:SqlDataSource ID="SqlDataSource2" runat="server" 

ConnectionString="<%$ ConnectionStrings:WeiBoConnectionString %>" 

SelectCommand="SELECT [user_id], [user name], [user_login], [user_sex], 
[user_email], [user_info], [home _url], [user telephone], [user birthday], [user_address], [regist_time] 
FROM [Z_USER] WHERE ([user id] = @user id)"> 

<SelectParameters> 

<asp:ControlParameter ControllD="GridView1" Name="user_id" 
PropertyName="SelectedValue" Type="Int32" /> 


</SelectParameters> 
</asp:SqlDataSource> 
其 加 WHERE f x 
gw NERE 子 句 中 添加 一 个 或 多 个 条 件 。 可 以 为 渗 个 条 件 指定 文本 值 或 参数 化 的 值 。 参 数 化 的 值 在 运行 时 根据 其 属性 艾 取 
ND same 
user_id x) 2r no 
RO. riimi Ix] 
= x] Fue 
BO 
[Contro 回 
SQL 表达 式 (8: 
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SQL 表达 式 值 ERD 
[user_id] = @user_id GridViewi. SelectedValue 


图 5-45 “添加 WHERE 子 句 ”对 话 框 


(9) 上 述 代 码 中 GridView 控件 的 SelectedValue 属性 对 应 GridView 控件 的 
DataKeyNames 字段 的 值 ， 由 于 前 面 设置 GridView 控件 的 DataKeyNames 为 两 个 字段 ， 所 
以 此 处 略 作 修改 ， 将 <SelectParameters> 修 改 为 如 下 代码 : 


<SelectParameters> 
<asp:ControlParameter ControllD="GridView1" Name="user_id" 
PropertyName="SelectedDataKey.Values[1]" Type="Int32" /> 
</SelectParameters> 


(10) 通过 “DetailsView 任务 ”面板 中 的 “编辑 字段 ”选项 ， 将 控件 中 的 字段 信息 都 修 
改 为 中 文 ， 通 过 “自动 套用 格式 ”选项 设置 控件 的 外 观 。 

(11) 至 此 ， 已 完成 所 有 工作 ， 没 有 编写 任何 代码 ， 一 个 简单 的 主 -从 数据 显示 页 面 就 
做 好 了 ， 编 译 并 运行 程序 ， 在 浏览 器 中 打开 ShowMsg.aspx 页 面 。 当 选择 GridView 控件 中 
的 某 一 条 记录 时 ， 下 面 将 显示 该 信息 的 作者 信息 ， 如 图 5-46 所 示 。 
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5.5 使 用 ADO.NET 访问 XML 


如 何 使 用 ADO.NET 访问 数据 库 的 问题 已 经 讨论 过 了 。 数 据 库 是 进行 数据 存储 和 管理 
的 一 种 习惯 的 方式 。 现在 , XML 已 逐步 成 为 数据 存储 的 一 种 新 的 方式 ， 因 此 可 以 考虑 将 数 
据 保 存在 XML 文档 中 ， 并 采用 一 定 的 方法 对 它 进行 管理 。ADO.NET 提供 了 对 XML 数据 
访问 的 功能 。 


5.5.1 XML 概述 


XML(eXtensible Markup Language， 称 为 可 扩展 标记 语言 ) 是 一 种 可 以 用 来 创建 自己 的 
标记 的 标记 语言 。 它 由 万 维 网 协会 (W3C) 创 建 ， 用 来 克服 HTML( 即 超 文本 标记 语言 
Hypertext Markup Language) 的 局 限 。 和 HTML 一样 ，XML 基于 SGMI 一 一 标准 通用 标记 
语言 (Standard Generalized Markup Language)。XML 是 SGML 上 的 一 个 子 集 ，XML 包含 了 
SGML 的 很 多 特性 ， 但 是 要 比 SGML 简单 得 多 。 

XML 是 一 种 类 似 于 HTML 的 标记 语言 ， 但 是 XML 不 是 HTML HR, XML 和 
HTML 是 两 种 不 同 用 途 的 语言 ， 其 中 最 主要 的 区 别 是 : XML 专门 用 来 描述 文本 的 结构 ， 
而 不 是 用 于 描述 如 何 显 示 文 本 的 ， 而 HIML 则 是 用 来 描述 如 何 显示 文本 的 。 

XML 提供 了 一 种 保存 数据 的 格式 , 数据 可 以 通过 这 种 格式 很 容易 地 在 不 同 的 应 用 程序 
之 间 实 现 共享 。 它 是 用 来 存放 数据 的 ， 可 以 利用 相关 的 XML APIIMSXML DOM, JAVA 
DOM 等 ) 对 XML 进行 存 取 和 查询 。 
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552 ”使 用 ADO.NET 读 写 XML 数据 


使 用 DataSet 的 ReadXml 方法 可 以 读 取 所 有 XML 文档 数据 ， 使 用 WriteXml 方法 可 
以 将 数据 保存 到 XML 文件 中 。 下 面 通过 一 个 例子 来 说 明 读 写 XML 文件 的 方法 。 

例 5-11: 使 用 DataSet 读 写 XML 文档 。 

(1) 启动 VWD 2010， 打 开 网 站 Chapter5。 

(2) 通过 “添加 新 项 ”命令 ,添加 一 个 名 为 Users.xml 的 XML 文件 , 文件 的 内 容 如 下 : 


<?xml version="1.0" encoding="utf-8" ?> 
<Users> 
<User> 
<user id>1</user id> 
<user name> 赵 艳 铎 </user name> 
<user Sex> 男 </user sex> 
<user telephone>15910806516</user telephone> 
<user_address> 北 京 市 海淀 区 </user_address> 
<user info> 世 上 没有 永 不 分 离 </user info> 
</User> 
<User> 
<user id>2</user id> 
<user name> 小 石头 </user_name> 
<user sex> 男 </user sex> 
<user telephone>82166054</user_telephone> 
<user_ address> 浙 江 省 杭州 市 </user_address> 
<user_info> 万 念 俱 灰 ， 跨 路 满 志 </user_info> 
</User> 
<User> 
<user id>3</user id> 
<user name> 葛 萌 萌 </user_name> 
<Uuser_ Sex> 女 </user sex> 
<user_telephone>03172053456</user_telephone> 
<user_ address> 河 北 省 沧州 市 </user_ address> 
<user info> 你 也 许 已 走出 我 的 视线 ， 但 从 未 走出 我 的 思念 </user_ info> 
</User> 
</Users> 


(3) 通过 “添加 新 项 ”命令 ， 添 加 一 个 名 为 XmlTest.aspx 的 页 面 ， 打 开 页 面 的 “设计 ” 
视图 ， 添 加 两 个 Button 控件 和 一 个 GridView 控件 ，Button 控件 的 Text 属性 分 别 为 “加 载 
数据 ”和 “修改 并 保存 数据 ”。 

(4) 双击 按钮 ， 为 两 个 按钮 添加 单 击 事件 处 理 程序 ， 代 码 如 下 : 


protected void Button1_Click(object sender, EventArgs e) 
1 
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DataSet ds = new DataSet(); 


ds.ReadXml(Server.MapPath("Users.xml"));// 读 取 XML 数据 到 DataSet 数据 集 


GridView1.DataSource = ds.Tables[0] DefaultView:// 绑 定数 据 源 
GridView1.DataBind(); 
} 
protected void Button2_Click(object sender, EventArgs e) 
DataSet ds = new DataSet(); 
ds.ReadXml(Server.MapPath("Users.xml")); 
DataTable dtable = ds.Tables[0]: 
/用 DataRowCollection 对 象 获取 这 个 数据 表 的 所 有 数据 行 
DataRowCollection rows = dtable.Rows; 
/修改 操作 ， 逐 行 遍历 ， 取 出 各 行 的 数据 
for (int i = 0; i < rows.Count; i++) 
d 
DataRow row = rows[i]: 
/修改 user id 为 奇数 的 user info 值 
if(Int32.Parse(row[0].ToString0)%2=1) 
row[5] = "我 是 "+row[1]+", 来 自 "+row[4]; 


ds.WriteXml(Server.MapPath("Users.xml"));// 将 DataSet 数据 写成 XML 文本 


// 绑 定数 据 源 ， 重 新 加 载 并 显示 
GridView1.DataSource = ds.Tables[0].DefaultView; 
GridView1.DataBindO; 


(5) 编译 并 运行 程序 ， 在 浏览 器 中 打开 XmlTest.aspx 文件 ， 单 击 “ 加 载 数 据 ” 按 钮 ， 
读 取 xml 文件 中 的 内 容 ， 并 显示 在 GridView 控件 中 ， 如 图 5-47 所 示 。 


XPO RED SEV wQ IAV HMU 


ARR Æ http://localhost: 1111/Chapter5/. 


a-a 


53- ED- 220- IRW- @- 


Ë http://localhost:1111/Chapter5/XalTest. aspx - Windows Internet Explorer m 1 画 
O [Elnu asan ake Jer 


[EELSETI 


user_id user_name user_sex user_telephone user_address 


user_info 


1 BeH 3 
2 小 石头 5 
3 Em < 


15910806516 北京 市 海淀 区 世上 没有 永 不 分 离 
82166054 ”浙江 省 杭州 市 万念俱灰 ， 跨 踏 满 志 
03172053456 ”河北 省 沧州 市 你 也 许 已 走出 我 的 视线 ， 但 从 未 走出 我 的 思念 


@ r ne m 


图 5-47 ”加载 XML 文件 中 的 数据 


(6) 单 击 “修改 并 保存 数据 ”按钮 ， 修 改 user id 为 奇数 的 用 户 的 user_info 值 并 保存 ， 
然后 重新 加 载 并 显示 ， 如 图 5-48 所 示 。 
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图 5-48 ”修改 并 保存 数据 


553 ”将 数据 库 中 的 数据 转换 成 XML 文档 


使 用 XML 做 数据 交换 可 以 使 应 用 程序 更 具有 弹性 , 因为 可 以 用 位 置 (与 普通 文件 一 样 ) 
或 用 元 素 (从 数据 库 ) 来 存 取 XML 数据 。 

如 果 数 据 集 DataSet 中 填充 的 是 数据 库 中 的 数据 ， 那 么 调用 WriteXml 方法 后 ， 即 可 将 
数据 库 数据 转换 成 XML 文档 。 

例 5-12: 查询 数据 库 中 Z MESSAGE 表 中 的 数据 ， 并 将 其 转换 成 XML 文档 。 

(1) 启动 VWD 2010， 打 开 网 站 Chapter5。 

(2) 通过 “添加 新 项 ”命令 ， 添 加 一 个 名 为 Db2Xml.aspx 的 页 面 ， 切 换 到 页 面 的 “ 设 
计 ” 视 图 ， 添 加 一 个 Button 控件 、 一 个 Label 控件 和 一 个 GridView 控件 ， 设 置 Button 控 
件 的 Text 属性 为 “保存 数据 到 XML”。 

(3) 切换 到 后 台 代 码 文件 ， 添 加 对 ADO.NET 命 空间 的 引用 ， 代 码 如 下 : 


using System.Data.SqlClient'; 
using System.Data; 
using System. Web.Configuration; 


(4) 为 按钮 控件 添加 单 击 事件 处 理 程序 ， 使 用 SqlDataAdapter 填充 数据 集 ， 将 学 生 表 
Student 中 的 数据 保存 到 XML 文件 中 ， 并 显示 在 GridView 控件 中 ， 代 码 如 下 : 


protected void Button1_Click(object sender, EventArgs e) 
í 
string strConn = 
WebConfigurationManager.ConnectionStrings["WeiBoConnectionString"].ConnectionString: 
SqlConnection con = new SqIConnection(strConn); 
DataSet ds = new DataSet(); 
try 
{ 
con.Open(); 
SqlDataAdapter sqld = new SqlDataAdapter("SELECT * FROM Z MESSAGE", con); 
sqld .Fill(ds, "msg");// 用 Fill 方法 填充 DataSet 
GridView1.DataSource = ds.Tables["msg"]; 
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GridView1.DataBind0: 


ds.WriteXml(Server.MapPath("message.xml")); 
Labell.Text = "保存 数据 到 XML 文件 成 功 ! "; 


catch (Exception ex) 
{ 
Labell.Text = "操作 失败 ， 失 败 原 因 : "+ ex.Message; 
} 
finally 
{ 
con.Close(); 
con = null; 
) 


) 


(5) 编译 并 运行 程序 ， 在 浏览 器 中 打开 Db2Xml.aspx 文件 ， 单 击 “ 保 存 数据 到 XML ” 


按钮 ， 读 取 数 据 表 Z MESSAGE 中 的 内 容 ， 并 显示 


显示 在 GridView 控件 中 ， 如 图 5-49 所 示 。 
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(6) 在 网 站 跟 目 录 ， 打 开 程 序 运行 时 保存 的 message.xml 文件 ， 内 容 如 下 : 


<9xml version="1.0" standalone="yes"?> 
<NewDataSet> 
<msg> 
<msg_id>1</msg_id> 
<user id>1</user id> 
<msg_content> 既 然 已 移 情 ， 那 么 请 别 恋 </msg_content> 
<reply_count>0</reply_count> 
<post_time>2012-07-07T22:22:22+08:00</post_time> 
</msg> 
<msg> 
<msg_id>2</msg_id> 
<user id>2</user id> 


<msg _ content> 读 懂 自 己 很 难 ， 塑 造 一 个 好 的 自己 更 难 。</msg _content> 


<reply_count>0</reply_count> 
<post time>2012-07-15T21:19:12.787+08:00</post_ time> 
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</msg> 

<msg> 
<msg id>3</msg id> 
<user id>3</user id> 
<msg_content>To be old and wise, you must first have to be young and stupid.</msg_content> 
<reply_count>0</reply_count> 
<post_time>2012-07-15T21:20:35.083+08:00</post_time> 

</msg> 

</NewDataSet> 


可 以 看 出 ， 这 个 文档 保存 了 Z MESSAGE 数据 表 中 所 有 的 数据 。 其 中 使 用 
<NewDataSet> 作 为 根 结 点 标记 ，<msg> 作 为 每 个 记录 的 标记 (msg 是 sqld.Fill(ds, "msg") 语 
句 中 使 用 的 名 字 )。 另 外 ， 每 个 字段 的 名 字 作 为 数据 元 素 的 标记 名 。 


56 ”本 章 小 结 


处 理 数据 库 的 能 力 是 对 Web 开发 技能 的 一 项 很 好 的 补充 。ASP.NET 应 用 程序 的 数据 
访问 是 通过 ADO.NET 进行 的 ，ADO.NET 可 以 使 Web 应 用 程序 从 各 种 数据 源 中 快速 访问 
数据 。 本 章 首先 介绍 了 数据 库 的 基本 知识 、 使 用 VWD 的 内 置 数 据 库 工具 创建 这 些 表 以 及 
使 用 SQL 语言 查询 和 操纵 数据 ; 接着 介绍 ADONET 访问 SQL Server 数据 库 的 方法 ; 然后 
讨论 了 VWD 提供 的 数据 控件 和 数据 绑 定 技术 ; 最 后 介绍 了 ADO.NET 访问 XML 数据 。 通 
过 本 章 的 学 习 读者 应 该 了 解 基本 的 数据 库 操 作 ， 能 够 使 用 SQL 从 数据 库 中 检索 指定 的 数 
据 ， 掌 握 如 何在 ASPX 页 面 中 访问 和 操作 数据 源 ， 以 及 数据 信息 的 显示 与 更 新 ， 学 会 设计 
主 -从 页 面 显示 数据 信息 。 


5.7 思考 和 练习 


1. 什么 是 SQL 语言 ，SQL 语言 具有 哪些 特点 和 功能 ? 

2. GROUP BY 子 句 用 于 对 查询 结果 进行 分 组 , 如 果 分 组 后 还 要 求 按 一 定 的 条 件 对 这 些 
组 进行 筛选 ， 最 终 只 输出 满足 指定 条 件 的 组 ， 需 要 使 用 什么 指定 筛选 条 件 ? 

3. 如 何 使 用 ADO.NET 调用 存储 过 程 。 

4. ASP.NET 提供 了 哪些 数据 源 控件 ? 

5. 要 使 用 GridView 控件 的 排序 功能 ， 需 要 设置 什么 属性 ? 

6. 对 于 简单 的 数据 绑 定 ， 必 须 调 用 页 面 或 者 控件 的 什么 方法 才能 使 绑 定 生效 ? 

7. DetailsView 控件 和 FormView 控件 有 什么 相同 点 ， 又 有 什么 区 别 ? 

8. DataKeyNames 属性 有 什么 作用 ? 


第 6 章 LINQ 


LINQ 是 一 种 与 .NET Framework 中 使 用 的 编程 语言 紧密 集成 的 新 查询 语言 。 使 用 LINQ 
可 以 直接 通过 代码 查询 多 种 数据 源 中 的 数据 。 本 章 将 主要 介绍 LINQ 的 语言 及 其 语法 ， 在 
ASP.NET 项 目 中 使 用 LINQ 查询 数据 的 许多 方法 ， 最 后 还 接送 了 数据 控件 和 LINQ 结合 
用 的 方法 与 技巧 。 通过 本 章 的 学 习 ， 读者 将 掌握 LINQ 的 基本 语法 以 及 LINQ to EF 的 具体 
应 用 。 

本 章 学 习 目 标 : 
LINQ 及 其 语法 
LINQ 的 各 种 形式 及 其 适用 场合 
T f ADO.NET Entity Framework 
使 用 EntityDataSource 控件 来 访问 EF 
ListView 控件 和 DataPage 控件 的 使 用 


61 LINQ 简介 


LINQ， 即 语言 集成 查询 (language-integrated query)， 是 一 种 与 .NET Framework 中 使 用 
的 编程 语言 紧密 集成 的 新 查询 语言 。 它 是 在 .NET 3.5 以 后 引入 的 ， 所 以 在 .NET 2.0 及 以 前 
的 版 本 中 是 不 能 使 用 LINQ 的 。 

使 用 LINQ 可 以 像 使 用 SQL 查询 数据 库 的 数据 那样 从 .NET 编程 语言 中 查询 数据 。 事 
SKE, LINQ 语法 部 分 模仿 了 SQL 语言， 使 熟悉 SQL 的 编程 人 员 更 容易 上 手 。 

使 用 LINQ 可 以 直接 通过 代码 查询 多 种 数据 源 中 的 数据 。LINQ 之 于 .NET 应 用 程序 编 
程 就 像 SQL 之 于 关系 数据 库 。 通 过 简单 的 、 声 明 性 的 语法 查询 集合 中 匹配 条 件 的 对 象 。 

LINQ 并 不 只 是 .NET Framework 的 一 个 增 件 。 相反, 它 被 设计 和 实现 为 .NET 编程 语言 
中 的 一 部 分 。 这 意味 着 LINQ 被 真正 集成 到 .NET 中 ， 为 查询 数据 提供 了 一 个 统一 的 方法 ， 
而 不 管 数据 的 来 源 。 另 外 ， 由 于 它 被 集成 到 语言 中 ， 而 不 是 特定 的 项 目 类 型 中 ， 所 以 可 用 
于 各 种 项 目 ， 包 括 Web 应 用 程序 、Windows Forms 应 用 程序 和 Console 应 用 程序 等 。 

LINQ 相关 的 类 都 放 在 System Linq 命名 空间 , 所 以 要 使 用 LINQ, 必须 引入 该 命名 空间 : 


using System.Ling; 


由 于 LINQ 非常 强大 ， 又 极 具 潜 力 ， 因 此 它 被 集成 到 NET Framewrok 的 多 个 方面 。 下 
面 将 介绍 不 同 的 LINQ 实现 。 
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6.1.1 LINQ to Objects 


这 是 语言 集成 的 最 基本 形式 。 使 用 LINQ to Objects 可 以 查询 .NET Framework 中 的 几 
乎 所 有 集合 .实际 上 , 使 用 LINQ to Objects 对 内 存 中 的 所 以 对 象 进行 简单 查询 是 非常 方便 的 。 


使 用 LINQ 的 查询 通常 由 3 个 步骤 组 成 : 
(1) 获得 数据 源 ; 

(2) 创建 查询 ; 

(3) 执行 查询 。 


例 6-1: 使 用 LINQ 查询 编号 为 奇数 的 用 户 信息 , 本 例 用 到 了 泛 型 中 的 Dictionary<K,V> 


定义 一 组 集合 。 
(1) 启动 VWD 2010， 新 建 空 网 站 Chapter6。 
(2) 通过 “添加 新 项 ”对 话 框 添加 一 个 名 为 LinqTest.aspx 的 页 面 。 
(3) 在 LinqTest.aspx 页 面 的 Load 事件 中 添加 如 下 代码 : 


protected void Page Load(object sender, EventArgs e) 
{ 
Dictionary<int, string> user = new Dictionary<int, string>(); 
user.Add(1, "XT FE"); 
user.Add(2, "hF K"); 
user.Add(3, "万 荫 荫 "); 
user.Add(4, "& L r"); 
var result = from val in user 
where val.Key % 2 = 1 
select val: 
Response.Write(" 全 部 信息 如 下 : <br/>"); 
foreach (var item in user) 


{ 


Response.Write(" 编 号 : "+item.Key +"; 姓名 : "+ item.Value); 


Response. Write("<br/>"); 
} 
Response.Write(" 查 询 结 果 如 下 : <br/>"); 
foreach (var item in result) 


{ 


Response.Write(" 编 号 : "+item.Key + "; 姓名 : "+ item.Value): 


Response. Write("<br/>"); 


上 述 代码 是 查询 编号 为 奇数 的 用 户 信息 并 输出 。 


(4) 编译 并 运行 程序 ， 在 浏览 器 中 打开 LinqTestaspx 页 面 ， 如 图 6-1 所 示 。 
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GO- a localhost x] 
文件 @) SED SEV KERW IAW 帮助 op 
A RER (Æ http://localhost:12... ü- 国 Š 


全 部 信息 如 下 ， 
编号 ，1 HA eaa 


编号 ，3; EZ, BAA 
号 ，4; ”姓名 , 金 百合 
查询 结果 如 下 


编号 ，1; PEZ, pus 
编号 ，3，， 姓名 : BBR 


@ Internet far Rios ~ 


图 6-1 页 面 运行 效果 


6.1.2 LINQ 与 泛 型 


LINQ 查询 是 建立 在 泛 型 这 种 数据 类 型 的 基础 之 上 的 ， 泛 型 是 从 .NET Framework 2.0 
开始 引入 的 。 虽 然 编程 人 员 无 须 深入 了 解 泛 型 技术 就 可 以 开始 编写 LINQ 查询 ， 但 是 了 解 
下 面 的 两 个 泛 型 的 基本 概念 有 助 于 帮助 读者 理解 其 工作 原理 。 

(1) 当 创建 泛 型 集合 类 (如 List<T>) 的 实例 时 , 需要 将 T 替换 为 集合 中 指定 的 对 象 类 型 ， 
如 字符 串 集合 表示 为 List<string>。 因 为 泛 型 集合 是 强 类 型 的 ， 所 以 比 将 元 素 存储 为 Object 
类 型 的 集合 要 强大 得 多 。 如 果 试 图 将 一 个 int 类 型 的 对 象 添加 到 List<string>， 则 会 产生 编 
译 错误 。 

(2) IEnumerable<T> 表 示 的 是 一 个 接口 ， 通 过 该 接口 可 以 使 用 foreach 语句 来 凯 历 泛 型 
集合 类 。LINQ 查询 变量 可 以 类 型 化 为 IEnumerable<T> 或 者 它 的 派生 类 , 如 IQueryable<T>。 

为 了 避免 使 用 泛 型 语法 ， 可 以 使 用 匿名 类 型 来 声明 查询 ， 即 使 用 var 关键 字 来 声明 查 
WJ. var 关键 字 指 示 编 译 器 通过 查看 在 from 子 句 中 指定 的 数据 来 推断 查询 变量 的 类 型 。 如 
在 例 6-1 中 声明 的 result 和 item 变量 。 

在 例 6-1 中 定义 的 泛 型 类 是 Dictionary<K,V>。 该 类 型 用 于 定义 键 / 值 (Key/Value) 对 的 
集合 。 与 List<T> 不 同 ， 这 个 类 需要 实例 化 两 个 类 型 ， 分 别 用 于 键 和 值 ， 以 表示 集合 中 的 
各 项 。 

实例 化 Dictionary<K, V> 对 象 后 , 就 可 以 对 它 执行 与 继承 自 DictionaryBase 的 类 相同 的 
操作 ， 例 如 ， 可 以 使 用 强 类 型 化 的 Add() 方 法 添加 键 / 值 对 ， 可 以 使 用 Keys 和 Values 属性 
迭代 集合 中 的 键 和 值 ;也 可 以 迭代 集合 中 的 各 个 项 ,把 每 个 项 作为 一 个 KeyValuePair<K, V> 
实例 来 获取 。 

6.1.3 LINQ to XML 


LINQ to XML 是 读 、 写 XML 的 一 种 新 的 .NET 方法 。 现在， 可 以 在 应 用 程序 中 编写 直 
接 针 对 XML 的 LINQ 查询 ， 而 不 是 使 用 普通 的 XML 查询 语言 ， 如 XSLT 或 XPath. 
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在 System.XmlLinq 命名 空间 中 定义 了 很 多 LINQ to XML 的 类 ， 这 些 类 的 结构 关系 如 


图 6-2 所 示 。 


XDeclaration XName | | XNamespace XObject 
XNode XAttribute 
XCData | | XText | |XContainer XComment XDocumentType | |XProcessingInstruction 
XDocument XElement 


图 6-2 LINQ to XML 的 类 结构 关系 


其 中 XElement 类 是 LINQ to XML 中 最 基础 的 类 , 使 用 它 可 以 创建 一 个 XMI 元 素 , 使 
用 XAttribute 类 可 以 为 元 素 添加 属性 ， 使 用 XNamespace 类 可 以 为 XML 定义 命名 空间 。 
例 6-2: 使 用 LINQ to XML 读 取 XML 文件 中 的 数据 ， 并 查询 符合 条 件 的 信息 将 其 保 
存 到 结果 xml 中 。 
(1) 启动 VWD 2010， 打 开 网 站 Chapter6。 
(2) 通过 “添加 新 项 ”对 话 框 添加 一 个 名 为 Users.xml 的 XML 文件 ， 其 内 容 与 第 5 章 
中 的 Users.xml 一 样 。 
(3) 继续 添加 一 个 名 为 Linq2Xml.aspx 的 页 面 ， 并 在 页 面 中 添加 一 个 Label 控件 ， 用 于 
显示 读 取 到 的 XML 数据 。 
(4) 切换 到 页 面 的 后 台 代码 文件 ， 引 入 命名 空间 System.Xml.Linq， 然 后 在 页 面 的 Load 
事件 中 添加 如 下 代码 : 
protected void Page Load(object sender, EventArgs e) 
i Labell.Text = "<table border=\"1\" cellpadding=\"1\"><tr align=\"center\">"; 
Labell.Text += "<td> 用 户 ID</td><td> 姓 名 </td><td> 性 别 </td><td> 电 话 </td>"; 
Labell.Text +="<td> 所 在 地 </td><td> 个 人 介绍 </td></tr>"; 
XElement users = XElement.Load(Server.MapPath("Users.xml")); 
foreach (XElement user in users.Elements()) 


$ 
Labell.Text+="<tr>"; 
foreach(XNode node in user.Nodes()) 
Labell.Text += "<td>" + node + "</td>"; 
Labell.Text += "</t>"; 
} 


Labell.Text += "</table>"; 
// 查 询 性 别 为 “ 男 ” 的 用 户 节点 
var result = from user in users.Nodes() 
where ((XElement)user).Element("user_sex"). Value = " 男 " 
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select user; 
Labell.Text += "<br> 性 别 为 “ 男 ”的 用 户 信息 如 下 : <br/><table border 1"; 
Labell.Text += " cellpadding=\"1\"><tr align=\"center\"><td> 用 户 ID</td><td> 姓 名 
</td>"; 

Labell.Text += "<td> 性 别 </td><td> 电 话 </td><td> 所 在 地 </td><td> 个 人 介绍 </td></tr>"; 
foreach (XElement user in result) 

Labell.Text += "<t>"; 

foreach (XNode node in user.Nodes()) 

Labell.Text += "<td>" + node + "</td>"; 
Labell Text += "</tr>"; 


} 
Labell.Text += "</table>"; 


} 
上 述 代 码 中 首先 加 载 XML 文件 中 的 数据 ， 并 以 表格 形式 显示 ， 然 后 查询 其 中 性 别 为 
男 ” 的 用 户 节点 并 显示 在 下 方 的 表格 中 。 
(5) 编译 并 运行 程序 ， 在 浏览 器 中 打开 Linq2Xml.aspx 页 面 ， 效 果 如 图 6-3 所 示 。 


| 


GO- [el edon Heke Ee 
THD RAD FEV CRRA TAV 帮助 mg 

ABER G mtp://ocslhost:12... A-D o @- mü0- #+@- Iw. ” 
APD | 姓名 性 别 电话 所 在 地 个 人 介绍 


1 BES [15910806516 北京 市 海淀 区 MERKET, ESRA 

Ë 小 石头 | 男 [s2166054 。 汤 江 省 杭州 市 万念俱灰， 踏足 满 志 

3 EAR (03172053456 河北 省 沧州 市 读 懂 自己 很 难 ， 塑 造 一 个 好 的 自己 更 难 
性 别 为 " 男 "的 用 户 信息 如 下 ， 

APD | 姓名 性 别 | ”电话 所 在 地 个 人 介绍 

1 EARE [15910806516 | 北京 市 海淀 区 如 果 我 消失 了 ， 谁 会 发 疯 ? 

Ë 小 石头 | 男 [82166054 。 浙江 省 杭州 市 5 $Ü, HARS 


完成 [ey 


图 6-3 Linq2Xml 页 面 运行 效果 


6.1.4 LINQto ADO.NET 


ADO.NET 是 NET Framework 的 一 部 分 ， 它 允许 访问 数据 、 数 据 服 务 ( 像 SQL Server) 
和 其 他 许多 不 同 的 数据 源 。 使 用 LINQ to ADO.NET， 可 以 查询 与 数据 库 相 关 的 信息 集 ， 包 
括 LINQ to Entities, LINQ to DataSet FI! LINQ to SQL- 
e LINQ to Entities 是 LINQ to SQL 的 超 集 ， 比 LINQ to SQL 有 更 丰富 的 功能 。 不 过 ， 
对 于 大 多 不 同类 型 的 应 用 程序 来 说 ，LINQ to SQL 已 经 足够 了 。 
e LINQ to DataSet 允许 对 DataSet 编写 查询 。 
© LINQ to SQL 允许 在 .NET 项 目 中 编写 针对 Microsoft SQL Server 数据 库 的 面向 对 象 
KAH. LINQ to SQL 将 LINQ 查询 转换 为 SQL 语句 , 然后 再 发 送 到 数据 库 中 执行 
CRUD 的 4 种 操作 。 在 ASP.NET 4 rh, Microsoft 已 经 表示 不 会 再 积极 开发 LINQ to 
SQL， 这 是 因为 LINQ to SQL 与 Entity Framework(EF) 在 功能 上 有 很 大 的 重 又 。 在 
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LINQ to SQL 中 能 实现 的 操作 在 EF 中 也 能 实现 。 但 是 ， 与 LINQ to SQL 相 比 ，EF 
的 功能 要 强大 得 多 , 并 且 功 能 要 丰富 得 多 。 正 因为 如 此 ,Entity Framework 是 比 LINQ 
to SQL 更 好 的 选择 。 本 章 将 重点 讨论 LINQ to Entity Framework。 


6.2 ADO.NET Entity Framework(EF) 


通过 使 用 ADO.NET Entity Framework(EF)， 可 以 把 许多 数据 库 对 象 (如 表 ) 转 换 成 可 以 
在 代码 中 直接 访问 的 .NET 对 象 。 然 后 就 可 以 在 查询 中 或 者 直接 在 数据 绑 定 中 使 用 这 些 对 
象 。EF 也 允许 执行 相反 操作 ， 首 先 设计 一 个 对 象 模 型 ， 然 后 让 EF 创建 必要 的 数据 库 结 构 。 


6.2.1 ADO.NET EF 简介 


通过 ADO.NET EF， 在 使 用 数据 库 时 不 必 编 写 大 量 代 码 。ADO.NET Entity Framework 
在 后 台大 量 使 用 LINQ。 使 用 EF 十 分 简单 ， 并 且 十 分 灵活 。 通 过 使 用 关系 图 设计 器 ， 可 以 
将 表 等 数据 库 对 象 拖 放 到 实体 模型 中 。 放 到 关系 图 中 的 对 象 将 成 为 可 用 的 对 象 。 例 如 ， 将 
Z_USER 表 放 到 关系 图 中 就 将 得 到 一 个 强 类 型 的 Z USER 类 。 可 以 使 用 LINQ 查询 或 者 其 
他 方式 创建 这 个 类 的 实例 。 

当 把 多 个 相关 的 数据 库 表 放 到 关系 图 中 时 ， 设 计 人 员 可 以 观察 到 表 之 间 的 关系 (如 表 
Z_USER 和 Z_USER_FUN), 然后 在 对 象 模型 中 复制 这 些 关 系 。 例 如 , 使 用 某 些 LINQ to EF 
查询 在 代码 中 创建 了 一 个 Z_USER_FUN 实例 ,那么 就 可 以 访问 它 的 Z_USER1 属性 ， 进 而 
可 以 访问 user login 等 属性 : 


Labell.Text = zUserFun.Z_USER1.user_login; 
类 似 地 ， 也 可 以 访问 某 个 用 户 的 所 有 听众 集合 Z_USER_FUN1s， 以 便 将 其 绑 定 到 数据 
绑 定 控件 : 
Repeater1.DataSource =ZUser.Z_USER_FUN1s; 


现在 还 不 需要 深究 这 些 语法 ， 本 章 将 详细 介绍 它们 。 
622 ”将 数据 模型 映射 到 对 象 模型 


通过 使 用 EF， 可 以 把 数据 库 项 (如 表 、 列 和 数据 库 中 的 关系 ) 映 射 到 应 用 程序 的 对 象 模 
型 中 的 对 象 和 属性 。VWD 提供 了 “ADO.NET 实体 数据 模型 ”模板 和 很 多 相关 的 工具 来 尽 
可 能 简化 这 种 映射 。 下 面 通过 一 个 具体 的 示例 来 介绍 如 何 通过 EF 把 数据 模型 映射 到 对 象 
模型 。 

例 6-3: 创建 ADONET 实体 数据 模型 ， 通 过 LINQ 查询 来 访问 底层 表 中 的 数据 。 

(1) 启动 VWD 2010， 打 开 网 站 Chapter6 。 
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(2) 在 “解决 方案 资源 管理 器 ”窗口 中 右 击 项 目 ， 从 弹出 的 快捷 菜单 中 选择 “添加 新 
项 ”命令 , 然后 选择 “ADO.NET 实体 数据 模型 ”模板 , 默认 名 称 为 Modeledmx， 单 击 “ 添 
加 ”按钮 将 其 添加 到 项 目 中 。 此 时 会 弹出 如 图 6-4 所 示 的 提示 框 ， 提 示 该 类 文件 通常 放 在 
App_Code 文件 夹 中 ， 单 击 “ 是 ”按钮 将 其 放 在 App_Code 文件 夹 中 。 也 可 以 直接 在 


App_Code 文件 夹 上 单 击 鼠 标 右 击 添加 。 


a rE AET atig Deta Mol EMS asr sz Fi. RAE, BEF ALERA, MEEDE “ 
LEE Cso ) 
图 6-4 ”提示 实体 数据 模型 文件 放 在 特殊 文件 夹 中 


G) 接着 启动“ 实体 数据 模型 向 导 ”， 第 一 步 是 “选择 模型 内 容 ”， 如 图 6-5 所 示 。 
选择 “从 数据 库 生 成 ”选项 ， 然 后 单 击 “ 下 一 步 ”按钮 。 
sss: 


g 国 r 


m= == ú 


人 BPA GEA. 大 


图 6-5 “选择 模型 内 容 ” 对 话 框 


(4) 在 “选择 您 的 数据 连接 ”对 话 框 中 ， 从 下 拉 列 表 框 中 选择 第 5 章 中 使 用 的 WeiBo 
数据 库 连接 ， 并 选中 “将 Web.Config 中 的 实体 连接 设置 另存 为 ” 复 选 杠 ， 如 图 6-6 所 示 。 


回 $$ web. config 中 的 实体 连接 设置 另存 为 G): 


E z 
图 6-6 “选择 您 的 数据 连接 ”对 话 框 
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(5) 单 击 “ 下 一 步 ” 按 钮 ， 进 入 “选择 数据 库 对 象 ” 对 话 框 。 在 该 对 话 框 中 ， 选 择 表 
Z_USER 和 Z USER FUN. 该 对 话 框 下 面 有 两 个 复 选 框 , 第 一 个 表示 在 模型 中 自动 将 所 有 
名 称 转换 为 单数 或 者 复数 形式 ， 第 二 个 是 在 模型 中 加 入 外 键 列 ， 选 中 这 两 个 复 选 框 可 以 确 
保生 成 的 对 象 模型 中 保留 表 之 间 的 关系 ， 如 图 6-7 所 示 。 如 果 没 有 选中 模型 中 自动 将 名 称 
转换 为 单数 或 者 复数 的 复 选 框 ， 则 需要 在 生成 模型 以 后 手动 进行 修改 。 

提示 : 

此 处 的 “模型 命名 空间 ”需要 记 住 ， 稍 后 编写 代码 时 要 引用 该 命名 空间 。 


(6) 单 击 “ 完 成 ”按钮 ， 即 可 将 模型 添加 到 站 点 中 。VWD 将 添加 一 个 Model.edmx X: 
件 和 Model.designer.cs 后 台 代码 文件 ， 然 后 在 主编 辑 器 窗口 中 打开 “实体 设计 器 ”， 如 图 
6-8 所 示 。 


T 过 和 让 对 和 


ORERNPURREMEENS D? 


[JC] Z MESSAGE (dbo) 

口 国 RELY (dbo) 

AE z_uSER (dbo) 

回国 USER FUN (dbo) 
视图 


O% 
* Di mit 


ep 
P home_url 
C SPuser_info 
WeiBollodel 已 导航 属性 

图 Z_USER FUNS € 

S| Z_USER FWI s 3 
C 

€ 


人 4 上 - 步 @ $ ELA Dih 
图 6-7 “选择 数据 库 对 象 ” 对 话 框 图 6-8 生成 的 实体 对 象 模型 关系 图 


这 个 关系 图 显示 了 基于 数据 库 表 生成 的 类 ， 两 个 类 之 间 的 线 表 示 了 底层 表 之 间 的 关 
系 。 二 者 是 两 个 1 对 多 的 关系 ， 即 一 个 用 户 可 以 收听 多 个 其 他 用 户 ， 同 时 也 可 以 被 多 个 用 
户 收听 。 所 以 图 中 Z USER 类 的 导航 属性 是 Z_USER_FUNs 和 Z_USER_FUN1s (复数 )， 
Z_USER_FUN 的 导航 属性 是 Z_USER 和 Z_USER1( 单 数 )。 


技巧 : 

如 果 前 面 没有 选中 自动 将 名 称 转换 为 单数 或 者 复数 的 复 选 框 ， 那 么 在 此 可 以 分 别 选 中 
生成 的 类 ， 然 后 在 “属性 ”面板 中 将 “实体 集 名 称 ” 改 为 复数 形式 ; 再 在 类 图 中 将 导航 属 
性 重 命名 为 复数 形式 。 导 航 属性 的 修改 需要 根据 具体 的 关系 ， 对 于 一 对 多 的 关系 中 的 “1? 
方 不 用 修改 为 复数 ， 而 “实体 集 名 称 ” 则 是 所 有 类 都 要 修改 。 


(7) 通过 “添加 新 项 ”对 话 框 添加 一 个 名 为 Linq2EF.aspx 的 页 面 ， 并 在 页 面 中 添加 一 
个 DropDownList 控件 和 两 个 GridView 控件 ， 其 中 , DropDownList 控件 用 于 显示 所 有 用 户 
的 登录 名 ， 两 个 GridView 控件 分 别 用 于 显示 选 定 用 户 的 听众 和 收听 人 。 

(8) 设置 DropDownList 控件 的 AutoPostBack 属性 为 True。 

(9) 切换 到 页 面 的 后 台 代 码 文 件 ， 引 入 前 面 生 成 实体 数据 模型 时 的 命名 空间 
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WeiBoModel， 然 后 在 页 面 的 Load 事件 中 添加 如 下 代码 : 


protected void Page Load(object sender, EventArgs e) 


í 
if (!Page.IsPostBack) 
i 
using (WeiBoEntities weiboEntity = new WeiBoEntities()) 
í 
var allUser = from user in weiboEntity.Z USER 
select user; 
DropDownList1.DataSource = allUser; 
DropDownList1.DataTextField = "user login"; 
DropDownListl.DataValueField = "user id"; 
DropDownList1.DataBindO; 
} 
} 
} 


说 明 : 

using 中 包装 的 代码 用 于 创建 在 用 完 后 必须 释放 (从 内 存 中 清除 ) 的 变量 。 由 于 
weiboEntity 保存 了 到 SQL Server 数据 库 的 连接 ， 因 此 将 使 用 它 的 代码 包装 到 using 块 中 ， 
这 样 对 象 会 在 块 的 末尾 销毁 。 


(10) 添加 DropDownList 控件 的 SelectedIndexChanged 事件 处 理 程序 ， 代 码 如 下 : 


protected void DropDownList1_SelectedIndexChanged(object sender, EventArgs e) 
{ 
int userId = Int32.Parse(DropDownList1.SelectedValue); 
using (WeiBoEntities weiboEntity = new WeiBoEntities()) 
{ 
var users = from userFun in weiboEntity.Z_USER_FUN 
where userFun.user_id == userId 
select userFun.Z_USER1; 
GridView1.DataSource = users:// 显 示 用 户 收听 的 人 
GridView1.DataBind0: 
var userFuns = from userFun in weiboEntity.Z USER FUN 
where userFun.fun user id = userId 
select userFun.Z_USER; 
GridView2.DataSource = userFuns;// 显 示 用 户 的 听众 
GridView2.DataBind0: 


j 


上 述 代码 中 ， 第 1 个 LIQN 查询 是 查询 Z_USER_FUN 表 中 user id 为 DropDownList 
控件 中 所 选用 户 id 的 记录 ,然后 显示 记录 对 应 的 导航 Z_USER1, 该 属性 为 Z USER 实例 。 
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第 2 个 查询 则 是 使 用 fun user id 属性 关联 DropDownList 控件 中 所 选用 户 的 id。 
(11) 编译 并 运行 程序 ,在 默认 浏览 器 中 加 载 Linq2EF.aspx 页 面 ,在 下 拉 列 表 中 选择 某 
个 用 户 , 下 方 的 GridView 控件 中 将 分 别 显示 该 用 户 的 收听 用 户 和 听众 信息 , 如 图 6-9 所 示 。 


os st: pter6/Li. Ë e: ore: 
GO e localhest 1212 PORC IPB 
HO RAO 查看 RERO IAV hw 
ARAR — http://localhost:1212/Charter6/Lin2E7. aspx | A-D OS- mmo 220 I0 @- ” 
PERN 
由 user_name user login user_passworduser sex user_email regist_time user_address user_birthday user_teler 
iis 2012-7-7 ”北京 市 海淀 1981- 429 d 
1 EB  yanduozsh zhaol234 男 haoyamdno@tsinghua org en 10.2859 区 113422 15910806: 
wa P m = 2012-7-7 河北 省 沧州 pr: -5-27 
3 BAA dahai dahail23 女 gcuxn@qq com 103317 市 138317051] 
Wr: 
user_id user_name user_login user_password user_sex user_email regist_time user_address user_birthday user_telep 
1 Bi ymdioh zhao1234 。 男 zhaoymdio@tingha orgen 01277 AORTNE L342 15910806: 
X 102859 区 34:22 
可 国 | 
= Oe ne u V 


图 6-9 显示 指定 用 户 的 收听 和 听众 信息 


通过 这 个 例子 可 以 看 出 ，EF 提供 了 一 个 对 象 关系 设计 器 (可 以 通过 VWD 访问 )， 人 允许 
基于 数据 库 的 表 创建 一 个 可 通过 代码 访问 的 对 象 模型 。 只 要 将 表 拖 至 该 设计 器 ，VWD 就 
会 创建 可 用 于 访问 数据 库 中 底层 数据 的 代码 ， 而 无 须 自己 编写 大 量 代 码 。 拖 至 设计 器 上 的 
类 存储 在 .edmx 文件 和 其 后 台 代码 文件 中 。 其 后 台 代 码 中 包含 了 一 个 继承 自 ObjectContext 
的 上 下 文 类 ， 而 ObjectContext 是 EF 中 提供 对 数据 库 进行 访问 的 主要 实体 。 

在 生成 模型 后 ， 对 其 执行 LINQ 查询 ， 即 可 从 底层 数据 库 中 获取 数据 。 要 访问 这 些 数 
据 ， 需 要 一 个 ObjectContext 类 的 实例 ， 这 要 在 代码 的 using 块 中 创建 。 


63 LINQ 查询 语法 


前 面 的 例子 中 使 用 了 简单 的 LINQ 查询 ，LINQ 的 查询 能 力 远 高 于 此 。 本 节 将 重点 介 
绍 LINQ 查询 语法 。 需 要 注意 的 是 ，LINQ 语法 并 不 是 专门 为 Entity Framework 设计 的 。 下 
面 介绍 的 大 多 数 LINQ 概念 同样 适用 于 其 他 LINQ 实现 ， 如 LINQ to Objects 和 LINQ to 
ADO.NET 等 。 


634 基本 语法 


字 。 尽 管 本章 所 有 示例 是 在 LINQ to EF wisata 但 也 可 以 将 它们 应 用 到 其 他 LINQ 
实现 中 。 下 面 将 使 用 例 6-3 中 创建 的 名 为 weiboEntity 的 ObjectContext 对 象 作 为 查询 的 数 
据 源 ， 系 统 地 介绍 LINQ 查询 的 基本 语法 。 
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1. from 

LINQ 查询 表达 式 必 须 以 from FIFAk. AE from 子 句 不 能 算是 标准 查询 操作 符 ， 
因为 它 并 不 对 数据 进行 操作 而 是 指向 数据 ， 但 它 是 LINQ 查询 中 的 一 个 重要 元 素 ， 因 为 它 
定义 了 查询 所 执行 的 集合 或 数据 源 。 在 例 6-3 中 的 from 子 句 指定 了 查询 必须 对 EF 中 的 
weiboEntity 对 象 所 提供 的 Z USER 集合 执行 。 


2. select 


select 关键 字 用 于 从 查询 的 源 中 检索 对 象 。 例 如 ， 下 面 的 查询 是 选择 已 有 类 型 的 一 个 
对 象 。 


var allUser = from user in weiboEntity.Z_ USER 
select user; 


这 一 示例 中 的 变量 user 是 范围 变量 (range variable)， 它 只 在 当前 查询 中 可 用 。 通 常 在 
from 子 句 中 引入 范围 变量 ， 然 后 在 where 和 select 子 句 中 再 次 使 用 它 来 筛选 数据 ， 表 明 要 
选择 的 数据 。 尽 管 对 于 它 可 采用 任意 的 名 称 ， 但 通常 看 到 的 都 是 单个 字母 的 变量 ， 如 u, 
或 所 查询 集合 的 单数 形式 user, 


3. where 


和 SQL 中 的 WHERE 子 句 一 样 ，LINQ 中 的 WHERE 子 句 允许 筛选 查询 返回 的 对 象 。 
WHERE 子 句 的 后 面 是 一 个 逻辑 表达 式 ， 例 如 ， 下 面 的 查询 将 返回 所 有 性 别 为 “ 男 ” 的 用 
户 信息 : 

var allUser = from user in weiboEntity.Z_USER 


where user.user_sex=" H" 
select user; 


4. orderby 


使 用 orderby 可 以 对 结果 集合 中 的 项 进行 排序 。orderby 后 面 可 以 通过 去 号 分 隔 来 指定 
多 个 条 件 。 紧 跟着 的 是 可 选 的 用 来 指定 排序 顺序 的 ascending( 升 序 ) 和 descending( 降 序 ) 关 键 
字 ， 默 认 排 序 方式 为 升序 。 例 如 下 列 的 查询 将 把 结果 按 user login 升序 ， 按 user_address 
降序 排列 。 


var allUser = from user in weiboEntity.Z USER 
where user.user_sex—" 男 " 
orderby user.user login ascending,user.user address descending 


select user; 


5. Sum. Min. Max. Average 和 Count 

这 些 聚 集运 算 符 允 许 在 结果 集中 的 对 象 上 进行 数学 计算 。Sum 是 求 和 运算 符 ; Min 是 
求 最 小 值 运算 符 ; Max 是 求 最 大 值 运算 符 ; Average 是 求 平 均值 运算 符 ;， Count 是 计数 运算 
符 。 例 如 ， 要 检索 指定 用 户 的 听众 数 ， 可 以 执行 如 下 查询 : 
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var userFuns = (from userFun in weiboEntity.Z_USER FUN 
where userFun.fun user id = userId 


select userFun).Count(); 
注意 : 
Count 方法 需要 作用 在 整个 结果 集 上 ， 因 此 ， 需 要 将 整个 语句 都 扩 到 括号 中 ， 然 后 再 
调用 Count 方法 。 


6. Take. Skip. TakeWhile 和 SkipWhile 


Take 和 Skip 允许 在 结果 集中 作 子 选择 。 这 通常 用 于 分 页 情况 ， 其 中 只 检索 当前 页 面 
的 记录 。Take 从 结果 集中 获取 所 请 求 数量 的 元 素 ， 然 后 忽略 其 余 的 ， 而 Skip 则 相反 ， 它 
跳 过 请 求 数量 的 元 素 ， 然 后 返回 其 余 的 。 

在 EF 中 ，Take 和 Skip 操作 符 也 被 转换 为 SQL 语句 。 这 意味 着 分 页 是 在 数据 库 级 发 
生 的 ， 而 不 是 在 ASP.NET 页 面 中 。 这 大 大 增强 了 查询 的 性 能 ， 特 别 是 对 于 一 些 较 大 的 结 
果 集 更 是 如 此 ， 因 为 不 是 所 有 的 元 素 都 必须 从 数据 库 转 移 到 ASP.NET 页 面 中 。 


注意 : 

要 想 使 用 Skip， 必 须 在 跳 过 指定 数量 的 记录 之 前 ， 向 查询 中 添加 一 个 orderby 子 句 来 
对 结果 进行 排序 。 如 果 不 显 式 地 添加 orderby 子 句 ， 数 据 库 就 可 能 以 无 法 预知 的 顺序 返回 
结果 ， 因 此 ， 在 LINQ 查询 中 添加 orderby 动作 有 助 于 从 Skip 方法 获得 一 致 的 结果 ， 因 为 
在 跳 过 和 获取 记录 之 前 ， 会 先 对 它们 进行 排序 。 


下 面 的 例子 显示 了 如 何 检索 第 二 页 的 记录 ， 假 定 页 面 大 小 为 10。 


var allUser = (from user in weiboEntity.Z_USER 
orderby user.user_ login ascending,user.user_address descending 
select user).Skip(10).Take(10): 


和 Count 一 样 , 该 查询 也 被 括 在 一 对 括号 中 , 然后 调用 Skip 和 Take 来 获取 请 求 的 记录 。 

TakeWhile 和 SkipWhile 查询 操作 符 的 工作 方式 类 似 , 但 允许 在 特定 条 件 满 足 时 获取 或 
跳 过 一 些 记录 。 遗 憾 的 是 ， 在 EF 中 无 法 使 用 它们 ， 但 是 通常 可 以 通过 给 查询 添加 一 个 简 
单 的 where 子 句 来 解决 这 个 问题 。 

7. Single 和 SingleOrDefault 


Single 和 SingleOrDefault 操作 符 允 许 返 回 单个 对 象 作为 强 类 型 化 实例 。 如 果 已 知 查询 
只 返回 一 条 记录 ， 将 很 用， 例如 ， 通 过 user login 查询 用 户 信息 。 
var oneUser = (from user in weiboEntity.Z_USER 


where user.user login 一 "yanduozh" 
select user).Single(); 


如 果 请 求 的 项 未 找到 或 是 查询 返回 多 个 实例 ，Single 操作 符 就 会 引发 异常 。 如 果 想 让 
该 方法 返回 null( 没 找到 ), 或 是 返回 相关 数据 类 型 的 默认 值 (如 Integer 型 的 0. Boolean 型 的 
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False 等 )， 则 使 用 SingleOrDefault。 


说 明 : 
即使 查询 结果 只 有 一 条 记录 ， 如 果 未 调用 Single， 则 仍 会 返回 一 个 列表 集合 。 通 过 使 
用 Single， 可 强制 结果 集 为 所 查询 类 型 的 单个 实例 。 


8. First、FirstOrDefault、Last 和 LastOrDefault 


这 些 操作 符 允 许 返 回 特定 对 象 序列 对 象 中 的 第 一 个 或 最 后 一 个 元 素 。 和 Single 方法 一 
样 ， 如 果 集 合 为 空 ，EFirst 和 Last 就 会 抛 出 异常 ， 而 FirstOrDefault 和 LastOrDefault 则 返回 
相关 数据 类 型 的 默认 值 。 

与 Single 不 同 的 是 ， 当 查询 返回 多 个 项 时 , First、 FirstOrDefault、 Last 和 LastOrDefault 
操作 符 并 不 抛 出 异常 。 


技巧 : 
EF 中 并 不 支持 Last 和 LastOrDefault 查询 。 不 过 ,通过 使 用 First 和 降序 排列 可 以 实现 
与 之 相同 的 操作 。 
例如 ， 下 面 的 查询 分 别 返 回 最 新 注册 的 用 户 和 最 早 注册 的 用 户 信息 : 
Var firstUser = (from user in weiboEntity.Z_USER 
orderby user.regist_time ascending 
select user).First(); 
var newUser = (from user in weiboEntity.Z_ USER 


orderby user.regist_time descending 
select user).First(); 


632 ”使 用 匿名 类 型 定形 数据 


到 目前 为 止 ， 在 本 章 前 几 节 中 看 到 的 查询 都 返回 的 是 全 类 型 。 即 查询 返回 了 一 个 
Student 实例 的 列表 (如 select 方法 ) 或 是 一 个 数值 (如 Count). 

不 过 ， 有 的 时 候 不 需要 这 些 对 象 的 所 有 信息 ， 或 者 想 对 某 些 信息 进行 映射 或 转换 。 例 
如 ， 在 例 6-3 中 ,希望 在 GridView 的 标题 列 显示 中 文 描述 信息 。 这 时 ， 可 以 通过 匿名 类 型 
(anonymous type) 来 重新 定义 要 显示 的 列 。 

匿名 类 型 是 一 种 不 需要 像 使 用 其 他 类 型 (如 类 ) 时 那样 预先 定义 名 称 的 类 型 。 而 是 可 以 
通过 选择 数据 ， 然 后 让 编译 器 推断 其 类 型 来 进行 构造 。 

创建 匿名 类 型 的 方法 很 简单 ; 不 需要 使 用 像 select user 这 样 的 语句 选择 实际 的 对 象 ， 
而 是 使 用 new 关键 字 ， 然 后 在 一 对 花 括 号 中 定义 要 选择 的 属性 。 例 如 : 


var u = from user in weiboEntity.Students 
where user.user login=="yanduozh" 


select new {user.user name.user.user info); 
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尽管 这 一 类 型 是 匿名 的 ， 不 能 通过 名 称 直 接 访问 ， 但 编译 器 仍 能 推断 其 类 型 ， 对 于 在 
查询 中 选择 的 新 属性 提供 了 完全 智能 识别 感知 功能 。 

除了 直接 选择 已 有 属性 外 ， 还 可 以 创建 属性 值 并 提供 不 同 的 名 称 。 例 如 修改 例 6-3 H 
查询 用 户 收听 和 听众 信息 的 LINQ 语句 ,创建 一 个 新 的 匿名 类 型 ， 用 中 文 重 命名 所 有 列 。 
修改 后 的 代码 如 下 : 


UD 


protected void DropDownList1_SelectedIndexChanged(object sender, EventArgs e) 
{ 
int userId = Int32.Parse(DropDownList1.SelectedValue); 
using (WeiBoEntities weiboEntity = new WeiBoEntitiesO) 
{ 
var users = from userFun in weiboEntity.Z_USER_FUN 
where userFun.user_id == userId 
select new 
{ 
用 户 ID = userFun.Z_USER1.user_id, 
姓名 =userFun.Z_USER1.user name, 
登录 名 =userFun.Z_USER1.user login, 
性 别 = userFun.Z USER. user _sex, 
#EH =userFun.Z USER. user birthday, 
所 在 地 = userFun.Z USER. user address, 
Email = userFun.Z_USER1.user_email, 
电话 = userFun.Z USER1.user telephone, 
个 人 简介 = userFun.Z USERIl.user info 
k 
GridView1.DataSource = users; 
GridView1.DataBind0; 
var userFuns = from userFun in weiboEntity.Z_USER_FUN 
where userFun.fun user id = userId 
select new 
d 
用 户 ID = userFun.Z USER.user_id, 
姓名 = userFun.Z_USER.user_name, 
登录 名 =userFun.Z USER. user login, 
性 别 = userFun.Z USER. user sex, 
生日 =userFun.Z_ USER.user birthday, 
所 在 地 = userFun.Z USER user address, 
Email = userFun.Z_USER.user email, 
电话 = userFun.Z USER. user telephone, 
个 人 简介 = userFun.Z USER. user info 
六 
GridView2.DataSource = userFuns; 
GridView2.DataBind0: 


) 
页 面 的 运行 效果 如 图 6-10 所 示 。 
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图 6-10 ”使 用 匿名 类 定形 数据 后 的 效果 


64 ”使 用 数据 控件 和 LINQ 


在 前 面 的 例子 中 ， 将 LINQ 查询 的 结果 指派 给 控件 的 DataSource 属性 ， 然 后 调用 
DataBind 方法 即 可 显示 在 页 面 中 。 但 是 ， 这 种 方法 只 能 显示 数据 ， 它 不 支持 直接 编辑 、 更 
新 和 删除 数据 。 本 节 将 介绍 EntityDataSource 控件 和 数据 控件 的 绑 定 ， 使 用 这 些 控件 可 以 
很 容易 地 实现 编辑 、 更 新 和 删除 功能 。 


6.4.1 EntityDataSource 控件 


EntityDataSource 和 SqlDataSource 以 及 其 他 数据 源 控件 类 似 。EntityDataSource 控件 之 
于 EF 就 像 SqlDataSource 控件 之 于 基于 SQL 的 数据 源 ， 它 提供 了 一 个 声明 性 的 方法 来 访 
问 支 持 LINQ 的 数据 源 模型 .和 SqlDataSource 控件 一 样 ，EntityDataSource 提供 了 对 CRUD 
操作 的 轻松 访问 ， 另 外 使 数据 排序 和 筛选 也 变 得 非常 简单 。 

EntityDataSource 控件 的 主要 属性 如 表 6-1 所 示 。 


表 6-1 EntityDataSource 控件 的 主要 属性 

属 性 描述 
EnableDelete 
EnableInsert 


表明 确定 控件 是 否 提供 自动 插入 、 更 新 和 删除 功能 。 如 果 启 用 ， 可 以 结合 使 用 


该 控件 和 数据 绑 定 控件 (如 GridView 或 ListView) 来 支持 数据 管理 
EnableUpdate 


ContextTypeName 控件 将 使 用 的 ObjectContext 类 的 名 称 


EntitySetName 想 使 用 的 EF 关系 图 中 的 表 实 体 集 名 ， 如 Reviews 
Select 


允许 定义 EntityDataSource 控件 对 模型 触发 的 查询 。 每 个 属性 都 映射 到 前 面 见 到 


OrderB: 
ai 过 的 一 个 查询 操作 


Where 
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和 数据 绑 定 控件 一 起 , EntityDataSource 通过 EF 提供 了 对 底层 SQL Server 数据 库 的 完 
全 访问 。 下 面 举例 说 明 该 控件 的 用 法 。 

例 6-4: 使 用 EntityDataSource 作为 数据 控件 的 数据 源 。 

(1) 启动 VWD 2010， 打 开 网 站 Chapter6 。 

(2) 通过 “添加 新 项 ”对 话 框 ， 添 加 名 为 EntityDataSourceTest.aspx 的 页 面 。 

(3) 在 EntityDataSourceTestaspx 页 面 的 “设计 ”视图 中 添加 一 个 EntityDataSource 控 
件 ， 在 “EntityDataSource 任务 ”面板 中 选择 “配置 数据 源 ” 选 项 ， 开 始 配置 数据 源 。 

(4) 第 一 步 是 “配置 ObjectContext”， 在 此 选择 例 6-3 中 创建 的 实体 数据 模型 的 命名 
连接 WeiBoEntities， 如 图 6-11 所 示 。 


ityDataSourcel 


g 配置 objeetContezt 


ConnectionString: 


OAZA 


[ 
O isu s 


DefaultContainerNane: 
[amu ties x] 


FED? RAO 


图 6-11 “配置 ObjectContext” 对 话 框 


(5) 单 击 “ 下 一 步 ” 按 钮 ， 在 “配置 数据 选择 ”对 话 框 中 选择 Z USER 实体 集 ， 并 选 
中 下 面 的 3 个 复 选 框 ， 如 图 6-12 所 示 。 


= CD Ce 
图 6-12 “配置 数据 选择 ”对 话 框 


(6) 单 击 “ 完 成 ”按钮 ， 完 成 数据 源 的 配置 。 

(7) 在 EntityDataSourceTest.aspx 页 面 中 添加 一 个 DetailsView 控件 。 设 置 控件 的 数据 
源 为 前 面 创建 的 数据 源 EntityDataSourcel， 并 选中 “DetailsView 任务 ”面板 中 的 “启用 分 
页 ”、“ 启 用 插入 ”、“ 启 用 编辑 ”和 “启用 删除 ” 复 选 框 ， 然 后 通过 “编辑 字段 ”选项 ， 
编辑 各 列 的 HeaderText 属性 为 中 文 描述 。 
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(8) 通过 “自动 套用 格式 ”选项 为 控件 设置 一 个 好 看 的 样式 。 
(9) 无 须 编写 任何 代码 ， 编 译 并 运行 程序 ， 在 浏览 器 中 加 载 EntityDataSourceTestaspx 
页 面 ， 效 果 如 图 6-13 所 示 。 


ttp: //localhozt:1212/Chapter6/EntityDataSo... 

[EEC m 

XPD SED SEV BRAW IAD HHY 

eE Ø rp:/Needhost:12 a-a- oe” 

RAPD 1 F 

姓名 eR 

登录 名 yanduozh 

密码 zhao1234 

性 别 男 

Email zhaoyanduo @tsinghua org cn 

注册 时 间 2012-7-7 10:28:59 

所 在 地 北京 市 海淀 区 

生日 1981-4-29 113422 

电话 15910806516 

个 人 微 博 地 址 yanduozh 

个 人 简介 我 自豪 我 骄 做 

编辑 手 陈 新 建 

| —— 
E n. uoa 


图 6-13 ”使 用 EntityDataSource 控件 页 面 运行 效果 
通过 这 个 示例 可 以 看 出 ， 创 建 和 使 用 EntityDataSource 数据 源 控件 和 使 用 SqlDataSource 
控件 一 样 简单 。 
6.4.2 ListView 控件 和 DataPager 控件 


ListView 控件 结合 了 GridView 丰富 的 功能 集 和 对 Repeater 提供 的 对 标记 的 控制 功能 ， 
并 且 还 具有 DetailsView 的 插入 行为 。ListView 可 以 以 不 同 的 格式 显示 数据 ， 包 括 网 格 ( 像 
GridView 那样 的 行 和 列 )、 项 目 符号 列表 和 流 格式 等 。 

ListView 通过 模板 来 显示 和 管理 其 数据 。 所 有 可 用 的 模板 如 表 6-2 所 示 。 


表 6-2 ListView 控件 的 可 用 模板 


# TR 描 ” 述 
作为 控件 的 容器 。 它 使 得 可 定义 一 个 放置 单独 数据 项 的 位 置 。 然 后 
<LayoutTemplate> 通过 ItemTemplate 和 AlternatingItemTemplate 表示 的 数据 项 作为 该 
容器 的 子 元 素 添加 
<ItemTemplate> 定义 控件 的 只 读 模 式 。 当 一 起 使 用 时 ， 它 们 可 以 创建 一 种 “斑马 纹 


<AlternatingltemTemplate> 效果 ”， 其 中 奇偶 行 有 着 不 同 的 外 观 (通常 是 不 同 的 背景 色 ) 

允许 定义 当前 活动 的 或 选择 的 项 的 外 观 

这 两 个 模板 允许 定义 用 于 插入 和 更 新 列表 中 的 项 的 用 户 界面 。 通 常 ， 
放置 文本 框 、 下 拉 列 表 和 其 他 服务 器 控件 等 ， 并 将 它们 与 底层 数据 
源 绑 定 


<SelectedItemTemplate> 


<InsertItemTemplate> 
<EditItemTemplate> 
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( 续 表 ) 
i R 描 Ë 
定义 放置 在 列表 中 项 之 间 的 标记 ， 可 用 于 在 项 之 间 添 加 线 、 图 像 或 
其 他 标记 
当 控件 中 没有 数据 显示 时 显示 该 模板 中 的 内 容 。 可 以 是 文本 或 其 他 


标记 


<ItemSeparatorTemplate> 


<EmptyDataTemplate> 


<GroupTemplate> 
在 高 级 表现 场景 中 使 用 ， 其 中 数据 可 呈现 在 不 同 的 组 中 


<GroupSeparatorTemplate> 


<EmptyItemTemplate> 


尽管 这 些 模板 看 上 去 让 人 觉得 需要 编写 大 量 代码 才能 使 用 ListView, 但 事实 并 非 如 此 。 
首先 ，VWD 2010 根据 一 些 控件 (如 EntityDataSource) 提 供 的 数据 ， 创 建 了 大 部 分 的 代码 ; 
其 次 ， 并 不 总 是 需要 所 有 的 模板 。 

除了 模板 之 外 ，ListView 控件 还 有 很 多 属性 ， 如 表 6-3 所 示 。 


表 6-3 ListView 控件 的 主要 属性 


模 A 描 g 
放置 在 LayoutTemplate 中 的 服务 器 端 控件 的 ID 。 当 该 属性 引用 的 控件 在 屏幕 
上 显示 时 ， 将 由 所 有 重复 的 数据 项 取代 。 它 可 以 是 一 个 真正 的 服务 器 控件 ， 
ItemPlaceholderID 如 <asp:PlaceHolder>; 或 者 是 一 个 简单 的 HTML 元 素 ， 带 有 一 个 有 效 的 ID, 
其 runat 特性 设置 为 server( 如 <ul runat="server" id=" MainList" ></ul>)。 如 果 不 
设置 该 属性 , ASP.NET 会 尝试 找到 ID 为 itemPlaceholder 的 控件 并 使 用 该 控件 
DataSourceID 页 面 上 数据 源 控 件 的 ID， 如 EntityDataSource 或 SqlDataSource 控件 
w 这 一 属性 的 枚 举 包 括 3 个 值 QNone、FirstItem 和 LastItem)， 人 允许 用 于 确定 
InsertItemPosition 


InsertItem Template 的 位 置 :在 列表 的 开始 或 末尾 ， 或 者 不 可 见 


和 其 他 数据 绑 定 控件 一 样 ，ListView 也 有 大 量 事件 。 例 如 ， 在 项 插入 到 底层 数据 源 前 
后 触发 的 ItemInserting 和 ItemInserted 事件 。 类 似 地 ， 也 有 在 更 新 和 删除 数据 前 后 触发 的 
事件 。 

ListView 控件 的 分 页 功能 是 通过 DataPager 控件 实现 的 .DataPager 控件 是 ASP.NET 3.5 
引入 的 控件 ,可 用 它 来 扩展 另 一 个 数据 绑 定 的 控件 。 目 前, 只 允许 使 用 DataPager X ListView 
控件 提供 分 页 功能 。 

有 两 种 方法 将 DataPager 与 ListView 控件 关联 。 

e 可 以 在 ListView 控件 的 <LayoutTemplate> 中 定义 它 ， 在 这 种 情况 下 ，DataPager 知 

道 应 自动 为 给 哪个 控件 提供 分 页 功能 。 

e 完全 在 ListView 的 外 部 定义 它 , 在 这 种 情况 下 , 需要 将 DataPager 的 PagedControlID 

属性 设置 为 有 效 ListView 控件 的 IJD。 

例 6-5: 使 用 ListView 控件 和 DataPager 控件 分 页 显示 当前 显示 用 户 发 表 的 所 有 信息 。 

(1) 启动 VWD 2010， 打 开 网 站 Chapter6。 

(2) 通过 “添加 新 项 ”对 话 框 添加 名 为 Model2.edmx 的 ADO.NET 实体 数据 模型 。 实 
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体 数据 模型 的 命名 连接 为 WeiBoMsgEntities ， 选 择 的 数据 库 对 象 是 表 Z USER 和 
Z_MESSAGE， 模 型 命名 控件 是 WeiBoMsgModel。 

(3) 通过 “添加 新 项 ”对 话 框 添加 名 为 ListView.aspx 的 页 面 。 

(4) 在 ListView.aspx 页 面 的 “设计 ”视图 中 添加 两 个 EntityDataSource 控件 ， 使 用 
Model2.edmx 实体 数据 模型 为 这 两 个 数据 源 控件 配置 数据 源 。 

(5) 配置 EntityDataSourcel 的 数据 源 时 ， 在 “配置 数据 选择 ”对 话 框 中 选择 Z_USER 
实体 集 ， 并 选中 下 面 的 3 个 复 选 框 。 

(6) 配置 EntityDataSource2 的 数据 源 时 ,在 “配置 数据 选择 ”对 话 框 中 选择 Z_MESSAGE 
实体 集 ， 并 选中 下 面 的 3 个 复 选 框 。 

(7) 添加 一 个 FormView 控件 , 设置 控件 的 数据 源 为 EntityDataSourcel,， 并 启用 分 页 功能 。 

(8) 在 “FormView 任务 ”面板 中 选择 “编辑 模板 ”选项 ， 打 开 “ 编 辑 模 板 模 式 ”， 从 
下 拉 列 表 中 选择 “ItemTemplate” 选 项 ， 将 该 模板 中 每 一 项 提示 文本 都 改 为 中 文 信息 ， 并 
删除 “密码 ”和 “头像 ”两 个 字段 (这 两 个 字段 将 不 显示 在 页 面 中 )， 如 图 6-14 所 示 。 


Formyierl - ItenTenplate 


ItemTenplate 
PID: [user_idLabel] 
名 ; [user_nameLabel] 
PA: [user_loginLabel] 
A: [user_sexLabel 


Pasa s: 


PAPP Ee infoLabel] 
图 6-14 ”编辑 模板 模式 


(9) 在 “属性 ”面板 中 设置 FormView 控件 的 DataKeyNames 属性 为 user_id。 

(10) 选中 数据 源 控件 EntityDataSource2, 在 “属性 ?面板 中 单 击 Where 属性 后 面 的 ”……” 
按钮 ， 打开 “表达 式 编辑 器 ”对 话 框 ,在 该 对 话 框 中 选中 “基于 提供 的 参数 自动 生成 Where 
表达 式 ” 复 选 框 , 然后 单 击 “ 添 加 参数 ”按钮 , 添加 参数 user id, 设置 “参数 源 ” 为 FormView 
控件 ， 如 图 6-15 所 示 ， 生 成 的 数据 源 控件 的 代码 如 下 所 示 。 


回 基于 提供 的 参数 自动 生成 mere FALO. 


S80: SEO 


| 全 a + | Cord x] 
B Patanta 


Ceo Jo 


图 6-15 “表达 式 编辑 器 ”对 话 杠 
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<asp:EntityDataSource ID="EntityDataSource2" runat="server" 
AutoGenerateWhereClause="True" ConnectionStringe="name=WeiBoMsgEntities" 
DefaultContainerName=" WeiBoMsgEntities" EnableDelete="True" 
EnableFlattening="False" EnableInsert="True" EnableUpdate="True" 
EntitySetName="Z MESSAGE" Where="" EntityTypeFilter="" Select=""> 
<WhereParameters> 

<asp:ControlParameter ControllD="FormView1" Name="user jd" 
PropertyName="SelectedValue" /> 

</WhereParameters> 

</asp:EntityDataSource> 


(11) 添加 一 个 ListView 控件 到 页 面 中 ， 设 置 控件 的 数据 源 为 EntityDataSource2 在 
“ListView 任务 ”面板 上 选择 “配置 ListView” 选 项 ， 打 开 “ 配 置 ListView” 对 话 框 ,在 
该 对 话 框 中 可 以 选择 控件 的 布局 、 样 式 和 是 否 启用 插入 、 更 新 和 分 页 等 操作 。 布局 选择 “网 
格 ”， 样 式 选 择 “ 专 业 型 ”， 同 时 选中 “启用 编辑 ”、“ 启 用 插入 ”、“ 启 用 删除 ”和 “ 启 
用 分 页 ” 复 选 框 ， 如 图 6-16 所 示 。 单 击 “ 确 定 ” 按 钮 ， 关 闭 该 对 话 框 。 如 果 有 对 话 框 询 问 


是 否 想 重新 生成 ListView 控件 ， 单 击 “ 是 ”按钮 即 可 。 
(12) 切换 至 “ 源 ” 视 图 ， 删 除 所 有 模板 中 的 <Z_USER> 列 ， 修 改 LayoutTemplate 模板 
中 的 列 标题 为 中 文 描述 。 
CT TTT "uu, 
Sinusa msg_id userjd | msg-eor 
e me nesz near 
w = nasz sear nese 
8: W naat ngent nest 
ma Hanz sanE awaz 
aane nesr near 
Ë miyar snar sear e 
s === J 


图 6-16 “配置 ListView” 对 话 框 


(13) 定位 到 LayoutTemplate 标记 ， 找 到 其 中 的 DataPager 控件 的 定义 ， 添 加 一 个 
PageSize 特性 并 设置 其 值 为 3。 代 码 如 下 所 示 : 


<td runat="server" 
style=""> 
<asp:DataPager ID="DataPagerl" runat="server" PageSize="3"> 
<Fields> 
<asp:NextPreviousPagerField ButtonType="Button" 


ShowFirstPageButton="True" 


ShowLastPageButton="True" /> 
</Fields> 
</asp:DataPager> 
</td> 
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说 明 : 
DataPager 控件 的 PageSize 属性 默认 值 为 10, 这 里 为 了 演示 分 页 功能 将 其 设置 的 比较 小 。 


(14) 编译 并 运行 程序 ， 页 面 运行 效果 如 图 6-17 所 示 。 
本 例 中 FormView 控件 支持 插入 、 编 辑 、 删 除 和 分 页 功能 ， 通 过 页 码 选择 不 同 的 用 户 ， 


下 面 的 ListView 控件 将 显示 该 用 户 发 表 的 信息 。ListView 控件 也 支持 插入 、 编 辑 、 删 除 和 
分 页 功能 。 


】 贡品 WO 
RP 2-0 


3 @ Rav- s20- I0- @- "| 


电话 : 15910806516 
个 人 催情 地 址 : yanduozh 


MAAN: RAERNRN 
Wi mn me 


w u user_id msg costest reply_count 


m), i ERREN. ELW y 
Co mT 
CAS 


H 
ar 


— Qu 


图 6-17 页 面 运行 效果 


65 本 章 小 结 


LINQ 是 .NET Framework 4 自 带 的 一 项 非常 有 用 的 技术 。 它 在 许多 数据 访问 场景 中 都 
是 一 种 重要 的 管道 技术 。 LINQ 可 用 于 查询 内 存 中 的 集合 。 另外 , 它 还 可 用 于 XML, Entities 
和 DataSet， 这 些 类 型 提供 了 对 不 同 数据 存储 的 访问 ， 但 使 用 相同 的 、 统 一 的 查询 语言 。 本 
章 主要 介绍 了 LINQ 语言 及 其 语法 ， 以 及 在 ASP.NET 项 目 中 使 用 使 用 EntityDataSource 控 
件 ， 这 个 控件 是 数据 绑 定 控件 和 模型 之 间 的 桥梁 。 通 过 本 章 的 学 习 ， 读 者 应 掌握 LINQ 的 
基本 语法 以 及 LINQto EF 的 具体 应 用 。 


6.6 思考 和 练习 


1. 要 使 用 LINQ， 必 须 引 入 哪个 命名 空间 ? 
2. 什么 是 匿名 类 ， 如 何 定义 匿名 类 ? 
3. LINQ 查询 表达 式 以 什么 开头 ? 
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4. Single 操作 符 有 什么 作用 ? 

5. 如 何 添 加 ADONET 实体 数据 模型 。 

6. EntityDataSource 数据 源 控件 有 什么 用 ? 

7. 与 其 他 数据 控件 (如 GridView 和 Repeater) 相 比 ，ListView 控件 的 主要 优势 在 哪里 ? 

8. 在 例 6-5 的 基础 上 ,编辑 FormView 控件 的 EditltemTemplate 模板 和 InsertItemTemplate 
模块 ， 实 现在 编辑 和 插入 记录 时 ， 可 以 通过 上 传 控件 来 上 传 头像 。 


第 7 章 Web 站 点 中 的 安全 性 


一 个 网 站 的 所 有 资源 通常 不 是 对 所 有 用 户 都 开发 ， 因 此 ， 需 要 考虑 用 一 种 安全 策略 来 
阻止 不 受 欢迎 的 用 户 访问 特定 内 容 。 还 需要 考虑 一 种 机 制 ， 允 许 用 户 注册 新 账户 并 登录 网 
Mh. ASP.NET 4 包含 了 创建 可 靠 而 且 安 全 的 安全 机 制 所 需 的 所 有 工具 。 本章 将 介绍 ASP.NET 
网 站 安全 性 相关 的 知识 ，ASP.NET 4 提供 的 登录 控件 的 使 用 以 及 如 何 使 用 ASP.NET 网 站 
管理 工具 对 网 站 进行 安全 管理 。 

本 章 学 习 目 标 : 

ASP.NET 验证 方式 
ASP.NET 应 用 程序 服务 
登录 控件 的 使 用 

使 用 WSAT 管理 用 户 和 角色 
以 编程 方式 检查 角色 
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随 着 Web 2.0、 社 交 网 络 和 微 博 等 一 系列 新 型 的 互联 网 产品 的 诞生 ，Web 环境 的 互联 
网 应 用 越 来 越 广泛 ， 企 业 信息 化 的 过 程 中 各 种 应 用 都 架设 在 Web 平台 上 ，Web 业务 的 迅 
速 发 展 也 引起 黑客 们 的 高 度 关注 ， 接 中 而 至 的 就 是 Web 安全 威胁 的 凸显 。 


7.1.1 关于 安全 性 


安全 性 是 系统 设计 、 实 现 和 管理 的 一 部 分 ， 其 作用 是 保证 系统 可 以 完全 按照 人 们 想 要 
的 方式 运行 。 从 另 一 个 角度 来 说 ， 安 全 性 的 作用 是 防止 系统 被 攻击 或 恶意 破坏 。 

安全 性 是 一 个 非常 复杂 的 主题 ， 它 通常 涉及 3 个 重要 的 问题 。 

e° 身份 : 身份 表示 用 户 是 谁 ， 对 于 一 个 Web 站点， 用 户 的 身份 通常 是 一 个 登录 名 。 

e 身份 验证 (Authentication): 身份 验证 就 是 如 何 证 明 你 所 具有 的 身份 ， 通常 以 用 户 名 
和 密码 配对 来 确认 用 户 的 身份 。 还 有 许多 其 他 身份 验证 机 制 , 包括 高 科技 的 指纹 或 
虹膜 扫描 、 智 能 卡 和 令 牌 等 。 本 章 只 讨论 用 户 名 和 密码 身份 验证 方式 。 

e 授权 (Authorization): 授权 是 指 登录 成 功 后 ， 用 户 被 允许 执行 的 操作 。 

ASPNET 中 的 这 些 安全 概念 是 使 用 应 用 程序 服务 (application service) 实 现 的 。 
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7.1.2 ASPNET 验证 方式 


ASP.NET 提供 多 种 方式 来 处 理 验证 请 求 和 确认 用 户 身份 ， 包 括 Windows 身份 验证 、 
窗 体 基本 验证 和 护照 验证 3 种 。 

e Windows 身份 验证 : Windows 身份 验证 是 使 用 传统 “基本 ”、NTLM/Kerberose 和 
Digest 验证 方式 ， 它 是 直接 使 用 Windows 域 用 户 权限 的 ， 换 名 话说 ，IIS 服务 器 直 
接 使 用 Windows 用 户 作为 网 站 会 员 ， 通 常 是 使 用 在 Intranet 环境 。 

o 窗 体 基本 验证 : 窗 体 基本 验证 方式 是 使 用 Web 窗 体 获取 用 户 名 和 密码 后 ， 以 
FormsAuthentication 类 或 Membership 类 方法 来 检查 用 户 身份 , 可 以 使 用 web.config 
文件 、XML 文件 或 数据 库 来 存储 会 员 数据 。 

e 护照 验证 : 护照 验证 是 Microsoft 提供 的 单一 登录 服务 ， 如 同 护照 一 样 ， 用 户 只 需 
登录 一 次 ， 就 可 以 进入 任何 参与 此 服务 的 群 组 网 站 。 

ASP.NET 的 验证 方式 可 以 通过 配置 文件 web.config 中 的 <authentication> 和 <authorization> 

标记 来 设置 。 


1. <authentication> 标 记 


ASP.NET 建立 的 Web 应 用 程序 如 果 需 要 使 用 验证 服务 ， 可 以 在 web.config 文件 的 
<authentication> 标 记 ( 在 <system.web> 子 标记 中 ) 中 指定 验证 方式 ，<authentication> 标 记 使 用 


mode 属性 指定 验证 方式 ， 其 属性 枚 举 值 如 表 7-1 所 示 ， 例 如 : 
<authentication mode="Windows"></authentication> 


表 7-1 mode 属性 的 属性 值 


使 用 窗 体 基本 验证 方式 
使 用 Windows 验证 方式 
使 用 护照 验证 方式 
不 使 用 验证 


Windows 


Passport 


2. <authorization> 标 记 


当 用 户 身份 经 过 验证 后 , 就 可 以 授予 用 户 权限 。 在 <authorization> 标 记 ( 在 <system.web> 
子 标记 中 ) 中 指定 用 户 权 限 ， 在 该 标记 中 可 以 有 0 到 多 个 <deny> 和 <allow> 子 标记 : <allow> 
标记 表示 允许 存 取 的 资源 ; <deny> 标 记 表 示 不 允许 存 取 的 资源 。 这 两 个 标记 具有 相同 的 属 
性 ， 如 表 7-2 所 示 。 
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表 7-2 <allow> 和 <deny> 标 记 的 属性 


属 描述 
使 用 逗号 “，” 分 隔 的 用 户 ， 这 些 用 户 人 允许 或 不 允许 存 取 资 源 ，“? ”代表 匿名 用 
iii 户 ，“*” 代 表 所 有 用 户 
z 45 使 用 逗号 “，” 分 隔 的 角色 ， 默 认为 Windows 群 组 名 称 ， 属 于 该 角色 的 用 户 允 许 或 
不 允许 存 取 资 源 
Verbs 使 用 逗号 “，” 分 隔 的 HTTP 传输 方法 ， 可 以 有 : GET. HEAD, POST 和 DEBUG 


例如 ， 下 面 的 配置 表示 用 户 gemm 允许 使 用 GET 方法 ， 具 有 Administrator 角色 的 用 
户 人 允许 使 用 POST 方法 ， 所 有 用 户 都 不 允许 使 用 DEBUG 方法 。 
<authorization> 
<allow users="gemm" verbs="GET"/> 
<allow roles="Administrator" verbs="POST"/> 


<deny users="*" verbs="DEBUG"/> 
</authorization> 


3. 窗 体 基本 验证 

ASP.NET 窗 体 基 本 验证 也 称 Cookie 基本 验证 , 因为 它 是 使 用 Cookie 来 存储 验证 记录 的 。 

当 用 户 成 功 登录 网 站 后 ， 以 Cookie 存储 的 验证 数据 就 会 建立 , 用 户 可 以 拥有 权限 进入 
其 他 需要 验证 的 网 页 。 如 果 用 户 尚未 登录 ， 则 会 进入 一 个 需要 验证 的 页 面 ， 就 会 自动 跳 转 
到 登录 网 页 ， 要 求 用 户 首先 登录 网 站 。 

当 <authentication> 标 记 的 mode 属性 为 Forms 时 ， 就 是 使 用 窗 体 基本 验证 ， 其 子 标记 
<forms> 可 以 指定 验证 的 Cookie 名 称 和 登录 网 页 的 URL 地 址 等 相关 信息 , 其 相关 的 属性 如 
表 7-3 所 示 。 


表 7-3 ”<forms> 标 记 的 属性 
属 性 H 述 
name 指定 验证 的 Cookie 名 称 ， 默 认 值 为 .ASPXAUTH， 需 要 指定 唯一 的 Cookie 名 
loginUrl 指定 登录 网 页 的 URL 地 址 ， 当 用 户 尚 未 通过 验证 就 转 到 此 页 ， 默 认 值 为 Default.aspx 
指定 Cookie 数据 的 保密 方式 ， 可 以 使 用 验证 或 加 密 保护 ， 属 性 值 None 表示 不 保密 ， 
protection | Encryption 表示 Cookie 数据 需要 加 密 ，Validation 表示 需要 验证 ， 默 认 值 ALL 表示 


需要 验证 和 加 密 
timeout 指定 Cookie 数据 的 超时 时 间 ， 以 分 钟 为 单位 ， 默 认 值 为 30 分 钟 
path 指定 Cookie 的 路 径 ， 默 认 值 为 “\” 


窗 体 基 本 验证 的 会 员 数 据 可 以 存储 在 web.config, XML 文件 或 数据 库 中 ， 如 果 存 储 在 
web.config 文件 中 ， 可 以 在 <forms> 标 记 的 <credentials> 子 标记 中 定义 用 户 名 和 密码 ,例如 : 
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<credentials passwordFormat="Clear"> 
<user name="gemm" password="ilovezhaoyd"/> 
<user name="zhaoyd" password="99123"/> 
</credentials> 


<credentials> 标 记 的 passwordFormat 属性 用 于 指定 密码 是 否 需 要 加 密 保护 ， 属 性 值 
Clear 表示 不 加 密 , MD5 表示 使 用 MDS5 哈 希 运算 加 密 , SHA1 表示 使 用 SHA1 哈 希 运算 加 密 。 

<credentials> 标 记 中 的 每 一 个 <user> 子 标记 , 用 于 指定 一 位 用 户 的 登录 名 和 密码 。name 
属性 指定 登录 名 ，password 属性 用 于 指定 登录 密码 。 


7.1.3 ASPNET 应 用 程序 服务 


ASP.NET 2.0 之 前 的 版 本 都 有 某 种 安全 性 支持 。 不 过 ， 它 们 都 缺乏 ASP.NET 2.0 和 之 
后 的 版 本 中 提供 的 高 级 控件 和 概念 。 在 ASP.NET 1.x 应 用 程序 中 ， 需 要 编写 大 量 代 码 来 实 
现 可 靠 的 安全 策略 。 而 且 需 要 在 所 有 Web 站 点 中 重复 编写 几乎 一 样 的 代码 。 

而 自从 应 用 程序 服务 随 着 ASPNET 2.0 一 起 问世 ， 这 些 问题 就 得 到 了 解决 。 应 用 程序 
服务 是 可 以 在 Web 应 用 程序 中 用 来 支持 用 户 、 角 色 和 配置 文件 等 的 一 组 服务 。ASP.NET 4 
中 仍然 大 量 存在 这 类 服务 。 其 中 最 重要 的 是 如 下 几 个 。 

o 成 员 (Membership): 可 以 管理 和 使 用 系统 中 的 用 户 账户 。 

© 角色 (Role): 可 以 管理 用 户 被 指派 的 角色 。 

e 配置 文件 (Profile): 允许 将 用 户 特 定 的 数据 存储 到 后 台数 据 库 。 

图 7-1 列 出 了 这 些 服务 的 概览 ， 显 示 了 它们 如 何 与 应 用 程序 Web 站 点 和 服务 可 能 使 用 
的 底层 数据 存储 相关 。 

在 图 7-1 的 顶部 ， 是 Web 站 点 和 Web 应 用 程序 。 这 些 网 站 可 以 包含 控件 ， 如 可 与 
ASP.NET 应 用 程序 服务 (如 成 员 和 配置 文件 ) 通 信 的 登录 控件 。 为 了 创建 一 个 灵活 的 解决 方 
案 ， 这 些 服务 不 直接 与 底层 数据 源 通信 ， 而 是 和 配置 好 的 提供 者 (provider) 通 信 。 提 供 者 是 
软件 中 可 用 于 特定 任务 的 可 交换 部 分 。 例 如 ， 在 成 员 服务 中 ， 成 员 提供 者 设计 为 对 底层 数 
据 存储 中 的 用 户 起 作用 。 可 以 根据 需要 为 相同 的 应 用 程序 服务 配置 不 同 的 提供 者 。 

每 个 提供 者 都 需要 一 个 数据 存储 (图 7-1 的 底部 )。 每 个 提供 者 都 编写 为 与 特定 数据 存 
储 一 起 使 用 。 例如，SQL Server 成 员 提供 者 (用 于 处 理 例如 创建 用 户 、 登 录 和 重 置 密码 这 样 
的 成 员 服 务 ) 和 SQL Server 角色 提供 者 (用 于 处 理 与 角色 相关 的 任务 ) 设 计 为 与 Microsoft 
SQL Server 数据 库 一 起 使 用 。 

在 理想 情况 下 ， 无 须 直接 处 理 这 些 提供 者 。 一 般 情 况 下 ， 在 一 个 集中 的 位 置 为 Web 
站 点 配置 不 同 的 提供 者 。 可 以 通过 与 应 用 程序 服务 通信 来 使 用 这 些 提供 者 。 尽 管 可 以 直接 
从 代码 访问 这 些 服务 ， 但 通常 是 使 用 ASP.NET 内 置 的 登录 控件 来 完成 这 些 困 难 的 工作 。 
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ASP.NET 4 Web 应 用 程序 /Web 站 点 
2 RS u. 


SqlMembershipProvider SqlRoleProvider | 其 他 提供 者 | 
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. š cros 其 他 数 3 
q 存储 


图 7-1 ASPNET 应 用 程序 服务 体系 


72 ”登录 控件 


与 数据 和 导航 控件 一 样 , 登录 控件 也 是 在 ASP.NET 2.0 中 引入 的 , 并 且 在 ASP.NET 4.0 
中 增加 了 很 多 强大 的 功能 。 随 ASP.NET 4.0 提供 的 登录 控件 去 除了 大 量 与 编写 Web 站 点 中 
的 安全 层 相 关 的 复杂 性 。 可 用 的 登录 控件 有 效 地 封装 了 验证 和 管理 用 户 所 需 的 所 有 代码 和 
逻辑 。 这 些 控件 通过 应 用 程序 服务 ， 与 已 配置 的 提供 者 通信 来 进行 工作 ， 而 不 是 直接 与 数 
据 库 通信 。 

ASP.NET 4.0 中 包含 7 个 登录 控件 ， 每 个 都 有 不 同 的 用 途 。 有 了 登录 控件 ， 只 需 很 少 
的 工作 量 就 可 以 构建 安全 的 Web 站 点 ， 另 外 ， 还 提供 了 一 些 工具 ， 让 用 户 可 以 修改 密码 ; 
或 者 如 果 忘 记 密码 ， 则 可 以 请 求 一 个 新 的 密码 ， 并 允许 根据 登录 状态 和 用 户 的 角色 显示 不 
同 的 数据 。 


7.2.1 Login 控件 


Login 控件 允许 用 户 登录 到 站 点 。 而 在 后 台 ， 它 通过 应 用 程序 服务 与 配置 好 的 成 员 提 
供 者 进行 通信 ， 查 看 用 户 名 和 密码 是 否 代 表 系 统 中 的 有 效用 户 。 如 果 用 户 通过 验证 ， 就 生 
成 发 送 到 用 户 浏览 器 的 cookie。 对 于 后 续 的 请 求 ， 浏 览 器 重新 提交 该 cookie 给 服务 器 ， 这 
样 系统 就 知道 它 仍 在 处 理 有 效用 户 。 成 员 提供 者 的 不 同 设置 都 在 web.config 文件 的 
<membership 人 元 素 中 进行 配置 。 

Login 控件 的 常用 属性 如 表 7-4 所 示 。 
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表 7-4_Login 控件 的 常用 属性 


F -性 描述 
DestinationPageUrl 该 属性 定义 了 登录 请 求 成 功 后 将 用 户 发 往 哪 个 URL 
CreateUserText 该 属性 控制 用 于 邀请 用 户 注册 新 账户 的 文本 
CreateUserUrl 该 属性 控制 用 户 注 册 新 账户 的 页 面 的 URL 


该 属性 指定 控件 是 否 显 示 Remember Me 选项 。 如 果 为 False 或 在 登录 时 未 
DisplayRememberMe 选择 该 复 选 框 ， 那 么 每 次 关闭 和 重新 打开 浏览 器 时 ， 用 户 需 要 重新 进行 身 
份 验 证 

RememberMeSet 该 属性 指定 最 初 是 否 选 择 Remember Me 选项 
PasswordRecoveryText | 该 属性 控制 用 于 告诉 用 户 可 重 置 或 恢复 他 们 密码 的 文本 
PasswordRecoveryUrl 该 属性 指定 用 户 可 获取 他 们 (新 ) 密 码 的 页 面 的 URL 
VisibleWhenLoggedIn 该 属性 控制 当前 用 户 登 录 时 控件 是 否 可 见 。 默 认 值 为 Tme 


除了 这 些 属 性 , Login 控件 还 有 一 些 Text 属性 , 如 LoginButtonText、 RememberMeText、 
TitleText 和 UserNameLabelText， 这 些 属 性 用 于 设置 控件 中 和 其 子 控件 (如 组 成 用 户 界面 的 
Button 和 Label 控件 ) 上 出 现 的 文本 信息 。 
默认 情况 下 , ASP.NET 的 身份 验证 机 制 假定 在 站 点 的 根 目录 下 有 一 个 用 于 用 户 登 录 的 
页 面 Login.aspx。 这 个 页 面 要 想 生 效 ， 至 少 需要 有 一 个 Login 控件 。 如 果 要 使 用 不 同 的 页 
面 ， 可 以 在 <authentication /> 下 面 的 <forms /> 元 素 中 指定 其 路 径 ， 如 下 所 示 ; 
<authentication mode="Forms"> 
<forms loginUrl="MyLoginPage.aspx" /> 
</authentication> 


注意 : 

在 Login 页 面 (配置 在 loginUrl 中 ) 上 ，Login 控件 的 VisibleWhenLoggedIn 属性 没有 作 
用 。 在 配置 过 的 Login 页 面 上 ，Login 控件 总 是 可 见 。 如 果 要 隐藏 它 ， 可 以 使 用 LoginView 
控件 。 


Login 控件 也 提供 了 一 些 事件 ， 这 些 事件 通常 不 需要 进行 处 理 ， 但 时 常 都 会 派 上 用 场 。 
例如 ，LoggedIn 事件 在 用 户 刚 登录 后 触发 ， 如 果 DestinationPageUrl 不 是 很 灵活 ， 这 里 是 
将 用 户 动态 发 送 到 另 一 页 面 的 理想 场所 。 

例 7-1: 使 用 Login 控件 登录 。 

(1) 启动 VWD 2010， 新 建 空 网 站 Chapter7。 

(2) 通过 “添加 新 项 ”对 话 框 添加 一 个 名 为 Login.aspx 的 页 面 。 

(3) 从 “工具 箱 ” 的 “登录 ”类 别 中 拖 放 一 个 Login 控件 到 该 页 面 上 。 

(4) 打开 Login 控件 的 “属性 ”面板 , 设置 控件 的 CreateUserText 属性 为 “注册 新 用 户 ”、 
CreateUserUrl 属性 为 ~/Register.aspx 、PasswordRecoveryText 属性 为 “忘记 密码 ”、 
PasswordRecoveryUrl 属性 为 “~/PasswordRecovery.aspx”。 
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当 学 习 其 他 控件 时 将 创建 注册 页 面 和 忘记 密码 页 面 。 

(5) 返回 到 Login.aspx, 保存 所 有 修改 , 编译 并 运行 程序 , 在 浏览 器 中 打开 Login 页 面 。 
如 图 7-2 所 示 。 

(6) 输入 任意 用 户 名 和 密码 尝试 登录 ， 将 显示 登录 失败 ， 因 为 此 时 还 没有 创建 该 账户 。 


说 明 : 
第 一 次 运行 该 页 面 时 ,可 能 需要 一 些 时 间 才 能 看 到 结果 ,因为 ASP.NET 忙于 建立 成 员 
数据 库 。 


(7) 由 于 此 时 ， 注 册页 面 和 忘记 密码 页 面 还 没 创建 ， 所 以 单 击 相 应 的 链接 ， 将 提示 页 
面 不 存在 。 

(8) 返回 到 VWD 2010， 在 “解决 方案 资源 管理 器 ”窗口 中 右 击 项 目 名 称 ， 从 弹出 的 
快捷 菜单 中 选择 “刷新 文件 夹 ” 命 令 ， 可 以 看 到 ， 项 目 中 添加 了 App Data 文件 夹 ， 其 中 
包括 一 个 数据 库 文 件 ASPNETDB.MDF， 如 图 7-3 所 示 。 
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图 7-2 登录 页 面 图 7-3 系统 自动 创建 数据 库 


在 本 例 中 ， 除 了 添加 和 配置 Login 控件 外 ， 并 未 编写 任何 代码 。 不 过 ， 仍 能 实现 一 个 功能 
完全 的 登录 过 程 ， 在 首次 尝试 登录 (或 使 用 需要 数据 库 访问 的 其 他 登录 控件 ) 时 ， 提 供 者 检查 应 
用 程序 是 否 在 使 用 带 有 必要 数据 库 对 象 (如 表 ) 的 数据 库 。 默 认 情况 下 ， 通 过 查找 名 为 
LocalSqlServer 的 连接 字符 串 检 查 数据 库 。 这 个 连接 字符 串 在 web.config 文件 中 无 法 找到 ， 因 
为 它 定义 在 .NET Framework 文件 夹 (C:\WINDOWS\Microsoft.NET\Framework\v4.0.30319\ 
Config) 中 名 为 machine.config 的 文件 中 。 本 书 也 将 学 习 该 文件 的 更 多 内 容 。 该 文件 中 的 连 
接 字 符 串 类 似 于 如 下 所 示 : 


<connectionStrings> 
<add name="LocalSqlServer" connectionString="data source=.\SQLEXPRESS;Integrated 
Security=SSPI;AttachDBFilename=|DataDirectory|aspnetdb.mdf:User Instance=true" 
providerName="System.Data.SqlClient"/> 
</connectionStrings> 


这 是 一 个 针对 SQL Server 2008 Express Edition(Microsoft SQL Server 的 免费 版 本 ) 的 连 
接 字 符 串 。 其 中 |DataDirectory| 指 向 Web 站 点 的 App_Data 文件 夹 .要 了 解 ASPNETDB.MDF 
的 详细 信息 ， 可 以 在 “服务 器 资源 管理 器 ”窗口 中 打开 该 数据 库 ， 查 看 该 数据 库 中 的 所 有 
表 信 息 。 
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722 ”LoginView 控件 


LoginView 控件 用 于 向 不 同 的 用 户 显示 不 同 的 数据 。 它 可 以 区 分 匿名 用 户 和 登录 用 户 ， 
甚至 区 分 不 同 角 色 中 的 用 户 。LoginView 是 模板 驱动 的 ， 因 此 程序 员 可 人 允 定 义 显 示 给 不 同 
户 的 不 同 模板 。 表 7-5 列 出 了 两 个 主要 的 模板 和 特殊 的 RoleGroups 元 素 。 


表 7-5 ”LoginView 控件 的 主要 模板 和 RoleGroups 元 素 


模板 描述 
AnonymousTemplate 该 模板 中 的 内 容 只 显示 给 未 进行 身份 验证 的 用 户 
该 模板 中 的 内 容 只 显示 给 登录 用 户 。 该 模板 与 AnonymousTemplate 互 斥 。 
ee 任何 时 候 只 有 其 中 一 个 模板 可 见 
该 模板 可 以 包含 一 个 或 多 个 RoleGroup 元 素 , 这 些 元 素 包含 一 个 定义 特定 
角色 的 内 容 的 ContentTemplate 元 素 。 人 允许 查看 内 容 的 角色 定义 在 Roles 
特性 中 ， 该 特性 采用 一 个 逗号 分 隔 的 角色 列表 。RoleGroups 元 素 与 
RoleGroups 


LoggedInTemplate 互 斥 。 这 意味 着 如 果 用 户 是 RoleGroup 的 其 中 一 个 角色 
中 的 成 员 ， 那 么 LoggedInTemplate 中 的 内 容 就 不 可 见 。 另 外 ， 只 有 匹配 
用 户 角色 的 第 一 个 RoleGroup 的 内 容 可 见 


除了 定义 在 ai 的 各 种 子 元 素 中 的 内 容 ，LoginView 控件 本 身 并 不 输出 任何 标记 ， 这 
意味 着 可 以 很 容易 得 将 它 嵌 入 一 对 HTML 标记 之 间 ， 如 <hl> 和 <li>， 从 而 创建 自 定义 标题 
或 者 列表 项 。 

下 列 代码 段 显示 了 一 个 LoginView 控件 ， 它 为 3 个 不 同 的 用 户 定义 了 内 容 ， 即 访问 站 
点 的 匿名 用 户 、 登 录用 户 ， 以 及 已 经 登录 并 且 是 Managers 角色 的 成 员 的 用 户 : 


<asp:LoginView ID="LoginView1" runat="server"> 
<AnonymousTemplate> 
这 是 匿名 用 户 看 到 的 信息 ， 是 否 <asp:HyperLink ID="HyperLinkl" runat="server" 
NavigateUrl="~/Register.aspx"> 注 册 </asp:HyperLink> 为 小 石头 网 站 的 新 用 户 。 
</AnonymousTemplate> 
<LoggedInTemplate> 
这 是 登录 会 员 看 到 的 信息 ， 欢 迎 你 ! 
</LoggedInTemplate> 
<RoleGroups> 
<asp:RoleGroup Roles="Managers"> 
<ContentTemplate> 
管理 员 你 好 ， 你 可 以 对 本 站 成 员 进行 管理 。 
</ContentTemplate> 
</asp:RoleGroup> 
</RoleGroups> 
</asp:LoginView> 
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章 7.3.2 节 将 介绍 如 何 创 建 和 配置 角色 的 内 容 。 
7.2.3 LoginStatus 控件 


LoginStatus 控件 提供 了 有 关 用 户 当前 状态 的 信息 。 当 用 户 未 进行 身份 验证 时 ， 它 提供 
“登录 ”链接 ， 当 用 户 登 录 后 ， 它 提供 “注销 ”链接 。 通 过 设置 LoginText 和 LogoutText 
属性 ， 可 以 控制 实际 显示 的 文本 。 也 可 以 设置 LoginImageUrl 和 LogoutImageUrl 属性 显示 
一 个 图 像 而 非 文本 。LogoutAction 属性 可 用 来 决定 在 用 户 注销 时 是 否 刷新 当前 页 面 ， 或 是 
否 在 用 户 注 销 后 将 用 户 带 至 另 一 个 页 面 ,通过 设置 LogoutPageUrl 可 以 确定 这 一 目标 页 面 。 

除了 这 些 属 性 ， 该 控件 可 以 引发 两 个 事件 : LoggingOut 和 LoggedOut， 它 们 分 别 在 用 
户 刚 注 销 前 后 触发 。 


7.2.4 LoginName 控件 


LoginName 是 一 个 极为 简单 的 控件 。 它 的 作用 就 是 显示 登录 用 户 的 名 称 。 为 了 将 用 户 
名 嵌入 到 一 些 文 本 中 ， 可 以 使 用 FormatString 属性 。 例 如 将 FormatString 属性 设置 为 “ 当 
前 登录 用 户 是 ，{0}”， 运 行 时 {0} 将 被 实际 登录 的 用 户 名 所 取代 。 

例 7-2: 使 用 LoginView、LoginStatus 和 LoginName 控件 创建 网 站 首页 Index.aspx。 

(1) 启动 VWD 2010， 打 开 网 站 Chapter7。 

(2) 通过 “添加 新 项 ”对 话 框 添加 名 为 Index.aspx 的 页 面 。 

(3) 切换 到 Index.aspx 的 “设计 ”视图 ， 添 加 一 个 LoginView 控件 和 一 个 LoginStatus 
控件 。 

(4) 选中 LoginView 控件 , 单 击 右 上 角 的 四 按钮 打开 “LoginView 任务 ”面板 ，“ 视 
图 ”列表 中 显示 当前 视图 为 AnonymousTemplate， 表示 当前 显示 为 “匿名 用 户 看 到 的 信息 ， 
此 时 在 LoginView 控件 上 输入 一 些 提示 信息 ， 并 添加 一 个 HyperLink 控件 ， 该 控件 将 导航 
用 户 到 “注册 ”页 面 。 如 图 7-4 所 示 。 


asp:LoginView#LoginViewl | 
LoginVi 


Viewl in¥i 
你 还 没有 登录 ， 是 省 注册 为 金 百合 网 站 的 新 用 户 称 汪 让 


图 7-4 设置 LoginView 控件 的 AnonymousTemplates 视图 


切换 到 “ 源 ” 视 图 ， 可 以 看 到 生成 的 代码 ， 如 下 所 示 : 


<asp:LoginView ID="LoginView1" runat="server"> 
<AnonymousTemplate> 
你 还 没有 登录 ， 是 否 <asp:HyperLink ID="HyperLinkl" runat="server" 
NavigateUrl="~/Register.aspx"> 注 册 </asp:HyperLink> 为 金 百合 网 站 的 新 
用 户 
</AnonymousTemplate> 
</asp:LoginView> 
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(5) 在 “LoginView 任务 ”面板 中 选择 LoggedInTemplate 视图 ， 在 LoginView 上 设置 
登录 成 功 的 用 户 看 到 的 信息 ， 使 用 LoginName 控件 显示 登录 用 户 名 ， 并 使 用 HyperLink 控 
件 提供 “修改 密码 ” 超 链 接 ， 最 终生 成 的 代码 如 下 : 


<asp:LoginView ID="LoginView1" runat="server"> 
<AnonymousTemplate> 
你 还 没有 登录 ， 是 否 <asp:HyperLink ID="HyperLink1" runat="server" 


NavigateUrl="~/Register.aspx"> 注 册 </asp:HyperLink> 为 金 百合 网 站 的 新 
用 户 


</AnonymousTemplate> 

<LoggedInTemplate> 
<asp:LoginName ID="LoginName1" runat="server" FormatString=" 欢 迎 你 ，{0}" 亿 
<br 这 你 可 以 
<asp:HyperLink ID="HyperLink2" runat="server" 

NavigateUrl="~/ChangePassword.aspx"> 修 改 密码 </asp:HyperLink> 
</LoggedInTemplate> 
</asp:LoginView> 


(6) LoginStatus 控件 也 有 两 个 视图 ， 如 果 尚 未 登录 ，LoginStatus 控件 将 提供 “登录 ” 
EJE; 如 图 已 经 登录 成 功 ，LoginStatus 控件 将 提供 “注销 ”链接 。 但 是 如 何 让 “登录 ” 链 
接 跳 转 到 例 7-1 中 创建 的 Login.axpx 页 面 呢 ? 这 需要 修改 web.config 的 配置 信息 。 打 开 
web.config， 在 < system.web> 元 素 下 添加 或 修改 认证 模式 为 如 下 代码 : 

<authentication mode="Forms"> 


<forms loginUrl="Login.aspx" timeout="2880" /> 
</authentication> 


(7) 编译 并 运行 程序 ， 在 浏览 器 中 打开 Index.aspx 页 面 ， 如 图 7-5 所 示 。 由 于 此 时 尚未 
登录 ， 所 以 LoginView 控件 显示 <AnonymousTemplate> 模 板 的 视图 ，LoginStatus 控件 显示 
为 “登录 ”链接 ， 单 击 “ 登 录 ” 超 链接 ， 将 跳 转 到 例 7-1 中 创建 的 Login.aspx 页 面 。 


Æ http://1ocalhost:1051/Chapter1/1... (- | DEJ 


JOE [Om /noon ~i 
XFO REV FEV KRRW IAV WHY 
ARRA |Æ ntp: oehost:10. &- “ 


你 还 没有 登录 ， 是 否 注册 为 金 百合 网 站 的 新 用 户 
登录 


n- Aio ~ 


图 7-5 网 站 首页 Index.aspx 


@ rus 


72.5 CreateUserWizard 控件 


CreateUserWizard 控件 用 于 注册 新 用 户 ， 该 控件 有 一 个 较 长 的 Text 属性 列表 ， 包 括 


CancelButtonText, CompleteSuccessText, UserNameLabelText 和 CreateUserButtonText， 它 
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们 会 影响 控件 中 使 用 的 文本 。 所 有 属性 都 有 默认 设置 ， 但 开发 人 员 也 可 以 将 其 修改 为 满足 
己 需求 的 内 容 。 
除了 文本 类 属性 , 该 控件 还 有 许多 以 ImageUrl 结尾 的 属性 ,如 CreateUserButtonImageUrl。 
这 些 属性 允许 定义 各 种 用 户 动 作 的 图 像 而 非 控件 生成 的 默认 按钮 。 如 果 设 置 任 一 属性 为 有 
效 的 ImageUrl， 则 还 需要 设置 相应 的 ButtonType。 例 如 ， 要 将 “创建 用 户 ” 按 钮 修改 为 图 
像 ， 则 需要 设置 CreateUserButtonImageUrl 为 有 效 图 像 并 设置 CreateUserButtonType 为 
Image. ButtonType 的 默认 值 为 Button， 默 认 情 况 下 它 呈 现 为 标准 的 按钮 。 也 可 以 设置 这 
些 属 性 为 Link， 这 样 它们 将 呈现 为 标准 的 LinkButton 控件 。 
另外 ， 该 控件 还 提供 了 大 量 可 设置 用 于 修改 其 行为 和 外 观 的 有 用 属性 ,如 表 7-6 所 示 。 


表 7-6 CreateUserWizard 控件 的 重要 属性 
B 性 j g 
ContinueDestinationPageUrl 该 属性 定义 用 户 在 注册 后 单 击 “ 继 续 ” 按 钮 时 被 带 往 的 页 面 
当 账 户 创建 时 是 否 将 用 户 标记 为 禁用 的 。 如 果 设置 为 True, WAE 


DisableCreatedUser N S 

账户 被 启用 前 ， 用 户 不 能 登录 到 该 站 点 。 默 认为 False 
LoginCreatedUser 在 账户 创建 后 是 否 让 用 户 自动 登录 。 默 认为 True 
RequireEmail 决定 控件 是 否 要 求 用 户 提供 电子 邮件 地 址 。 默 认为 True 

该 属性 包含 大 量子 属性 ， 允 许 定义 在 用 户 注册 后 发 送 给 他 们 的 电子 
MailDefinition 邮件 


CreateUserWizard 控件 能 够 向 用 户 发 送 一 封 确认 电子 邮件 ， 通 知 它们 新 账户 已 经 成 功 
建立 。 这 封 电子 邮件 可 以 提醒 它们 的 用 户 名 和 密码 。 
例 7-3: 使 用 CreateUserWizard 控件 创建 注册 页 面 Register.aspx。 
(1) 启动 VWD 2010， 打 开 网 站 Chapter7。 
(2) 通过 “添加 新 项 ”对 话 框 添 加 名 为 Register.aspx 的 页 面 。 
(3) 切换 到 Register.aspx 的 “设计 ”视图 ， 添 加 一 个 CreateUserWizard 控件 。 设 置 控 
件 的 ContinueDestinationPageUrl 属性 为 ~/Index.aspx。 
(4) 为 了 在 注册 新 用 户 成 功 后 能 够 给 用 户 发 送 电 子 邮 件 ， 还 需要 创建 一 个 邮件 模板 ， 
在 App_Data 文件 夹 中 添加 一 个 名 为 RegistConfirm.txt 的 文本 文件 ， 文 件 内 容 如 下 : 
Hi <% UserName %>, 
感谢 你 注册 为 金 百 合 网 站 的 新 用 户 . 
以 下 是 你 的 用 户 名 和 密码 信息 ， 请 牢记 : 


用 户 名 : <% UserName %> 
密 ” 码 : <% Password %> 


金 百合 网 站 全 体 人 员 祝 你 身体 健康 
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注意 : 
在 上 述 文本 文件 中 , 占 位 符 UserName 和 Password 包括 在 一 对 服务 器 端 标记 (<% 和 %>) 
中 ， 当 实际 发 送 邮 件 时 ， 将 被 用 户 在 注册 表单 中 输入 的 实际 用 户 名 和 密码 自动 取代 。 


(5) 返回 Registeraspx 页 面 ， 在 “属性 ”面板 中 设置 CreateUserWizard 控件 的 
MailDefinition 属性 , 展开 该 属性 , 设置 BodyFileName 属性 为 刚才 创建 的 RegistConfirm .txt， 
设置 Subject 属性 为 “恭喜 你 成 为 金 百 合 网 站 的 新 用 户 ”， 设 置 From 属性 为 网 站 官方 邮箱 
t mse@163.com( 用 户 收 到 的 邮件 将 显示 由 该 地 址 发 送 )。 

(6) MailDefinition 属性 设置 好 了 ， 要 保证 邮件 能 够 正确 发 送 ， 还 需要 在 web.config X 
件 中 配置 邮件 服务 器 ， 再 次 打开 web.config 文件 ， 在 根 元 素 <configuration> 中 添加 或 修改 
<system.net> 元 素 ， 此 处 需要 知道 SMTP 服务 器 的 地 址 和 发 送 邮件 的 Email 地 址 : 


<system.net> 
<mailSettings> 
<smtp deliveryMethod="Network" > 
<network host="smtp.163.com" /> 
</smtp> 
</mailSettings> 


</system.net> 
如 果 ISP 要 求 在 发 送 电子 邮件 之 前 进行 身份 验证 或 者 希望 使 用 一 个 不 同 的 端口 号 ， 可 
以 向 <network 人 元 素 中 添加 如 下 信息 : 
<smtp deliveryMethod="Network"> 
<network host="smtp.domain.com" userName="UserName" password="Password" port="587" /> 
</smtp> 
- 些 邮 件 服务 器 要 求 使 用 SSL，SSL 是 一 种 加 密 技 术 ， 用 于 加 密 发 送 到 邮件 服务 器 的 
数据 以 提高 安全 性 能 。 在 ASP.NET 4 之 前 的 版 本 中 ， 必 须 在 代码 中 编程 激活 SSL. I 
ASP.NET 4 中 ，<network 人 > 元 素 上 有 了 enableSsl 特性 ， 如 果 需 要 使 用 SSL 的 邮件 服务 器 ， 
可 以 使 用 如 下 所 示 的 <network 人 元素: 


<network enableSsl="true" host="smtp.gmail.com" password="Password" userName="UserName" /> 


(7) 编译 并 运行 程序 ， 在 浏览 器 中 打开 Register.aspx 页 面 ， 在 此 输入 注册 信息 ， 如 图 
7-6 所 示 。 单 击 “ 创 建 用 户 ” 按 钮 ， 提 示 创 建成 功 ， 如 图 7-7 所 示 。 


Je e Q imum 
xwe mo seo eaw IAD RD 
Li L a. a-a “| 


完成 
己 成 功 创建 低 的 帐户 - 


图 7-6 输入 注册 信息 图 7-7 注册 成 功 
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(8) 注册 成 功 后 ， 将 在 aspnet Membership 和 aspnet Users 表 中 创建 新 记录 。 同 时 ， 注 
册 时 填写 的 Email 中 将 收 到 一 封 由 网 站 发 出 的 邮件 , 邮件 内 容 就 是 前 面 设置 的 RegistConfirm txt 
模板 ， 如 图 7-8 所 示 。 


— 1 寺 喜 你 成 为 全 百合 网 站 的 困 用 户 一 Unicode (UTF-8) a mx} 
XPO SO SEV IAD MPW EMW [j 
Leas — X @ QO 

答复 全 部 答复 PR 打印 a å -S re 
RIA: t mse@163com 

日 期 : 20121423B 21:39 

REFA: zhaoyanduo@tsinghua orgen 

主题 : 。 共计 从 成 为 全 百合 网 站 的 新 用 户 


mee, p 


感谢 你 注册 为 金 百合 网 站 的 新 用 户 

以 下 是 你 的 用 户 名 和 密码 信息 ， 请 牢记 : 
用 户 名 ， 赵 艳 泽 

E W: %678asd 


金 百合 网 站 全 体 人 员 祝 你 身体 健康 


图 7-8 注册 成 功 邮 件 


其 实在 注册 新 用 户 时 ， 如 果 使 用 的 密码 过 于 简单 ， 也 将 提示 相应 的 错误 。 这 些 默 认 配 
置 的 来 源 也 是 在 machine.config 文件 中 。 打开 该 文件 , 定位 到 <system.web> 下 面 的 <membership> 
元 素 ， 如 下 所 示 : 


<membership> 
<providers> 
<add name="AspNetSqIMembershipProvider" 
type="System.Web.Security.SqIMembershipProvider, System.Web, Version=4.0.0.0, Culture=neutral, 
PublicKeyToken=b03f5f7f11d50a3a" connectionStringName="LocalSqlServer" 
enablePasswordRetrieval="false" enablePasswordReset="true" requiresQuestionAndAnswer="true" 
applicationName="/" requiresUniqueEmail="false" passwordFormat="Hashed" 
maxInvalidPasswordAttempts="5" minRequiredPasswordLength="7" 
minRequiredNonalphanumericCharacters="1" passwordAttemptWindow="10" 
passwordStrengthRegularExpression=""/> 
</providers> 
</membership> 


这 就 是 ASP.NET 默认 的 安全 策略 配置 要 求 密码 长 度 大 于 等 于 7， 且 至 少 包含 1 个 数 
字 或 特色 字符 。 

如 果 要 为 某 个 应 用 程序 配置 不 同 的 安全 策略 ， 可 以 在 应 用 程序 的 web.config 文件 中 修 
改 这些 设 置 。 在 <system.web> 下 面 添加 相应 的 <membership> 元 素 即 可 。 

默认 情况 下 ， 密 码 在 数据 库 中 是 以 散 列 形式 存储 的 ， 散 列 是 一 个 不 可 逆 的 过 程 ， 它 为 
数据 创建 唯一 索引 。 因 为 不 可 逆 ， 所 以 没有 办 法 通过 散 列 重新 得 到 原始 密码 ， 对 于 忘记 密 
码 的 情况 ， 则 可 以 使 用 PasswordRecovery 控件 生成 新 的 密码 ， 然 后 将 新 密码 发 送 到 用 户 注 
册 时 填写 的 Email 地 址 中 。 
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7.2.6 PasswordRecovery 控件 


PasswordRecovery 控件 允许 用 户 获 得 他 们 已 有 的 密码 (如 果 系 统 支持 ) 或 是 获得 一 个 新 
的 自动 生成 的 密码 。 在 这 两 种 情况 下 , 密码 都 将 发 送 到 用 户 注册 时 输入 的 电子 邮件 地 址 中 。 

了 PasswordRecovery 控件 的 大 部 分 属性 都 是 人 们 所 熟悉 的 。 它 有 大 量 Text 属性 ， 如 
GeneralFailureText ( 当 密 码 不 可 恢复 时 显示 ) 和 SuccessText， 该 属性 允许 设置 控件 显示 的 文 
本 。 还 有 一 些 以 ButtonType、BnuttonText 和 ButtonImageUrl 结尾 的 属性 ， 这 些 属性 允许 修 
改 控 件 的 不 同 动作 按钮 的 外 观 和 行为 。 如 果 密 码 成 功 恢复 ， 可 以 设置 SuccessPageUrl 将 用 
户 导 航 到 另 一 个 页 面 。 

和 CreateUserWizard 一 样 ， PasswordRecovery 也 有 一 个 MailDefinition 元 素 ， 该 元 素 用 
于 指向 作为 邮件 正文 发 送 的 文件 。 可 以 对 用 户 名 和 密码 使 用 同样 的 占 位 符 来 自 定义 消息 。 
如 果 不 对 MailDefinition 进行 配置 ， 则 控件 会 使 用 一 个 默认 的 邮件 正文 。 

例 7-4: 使 用 PasswordRecovery 控件 创建 忘记 密码 页 面 PasswordRecovery.aspx。 

(1) 启动 VWD 2010， 打 开 网 站 Chapter7。 

(2) 通过 “添加 新 项 ”对 话 框 添加 名 为 PasswordRecovery.aspx 的 页 面 。 

(3) 切换 到 PasswordRecovery.aspx 的 “设计 ” 视图, 添加 一 个 PasswordRecovery 控件 ， 
设置 控件 的 MailDefinition-Subject 属性 为 “你 在 金 百 合 网 站 的 新 密码 ”MailDefinition-From 
属性 为 发 送 新 密码 的 邮件 地 址 (此 地 址 可 以 与 注册 新 用 户 时 的 地 址 相同 也 可 以 不 同 )。 此 处 
不 用 设置 邮件 模板 ， 而 是 使 用 默认 的 邮件 模板 。 

(4) 编译 并 运行 程序 ， 在 浏览 器 中 打开 PasswordRecovery.aspx 页 面 ， 或 者 在 登录 页 面 
时 ， 单 击 “ 芒 记 密码 ”链接 即 可 打开 PasswordRecovery.aspx， 如 图 7-9 所 示 。 

(5) 输入 “用 户 名 ”， 单 击 “ 提 交 ” 按 钮 将 显示 注册 时 填写 的 “安全 提示 问题 ”， 输 
入 相应 的 答案 后 ， 单 击 “ 提 交 ” 按 钮 ， 即 可 收 到 新 密码 邮件 ， 如 图 7-10 所 示 。 
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图 7-9 忘记 密码 页 面 图 7-10 网 站 发 送 的 新 密码 邮件 


7.2.7 ChangePassword 控件 


ChangePassword 控件 允许 已 有 用 户 和 登录 用 户 更 改 他 们 的 密码 。 类似 于 CreateUserWizard 
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和 PasswordRecovery 控件 ， 它 有 许多 属性 ， 可 用 于 修改 文本 、 错 误 消 息 和 按钮 。 它 也 有 一 
个 MailDefinition 元 素 ， 人 允许 发 送 新 密码 的 确认 消息 给 用 户 的 电子 邮件 地 址 。 

例 7-5: 使 用 ChangePassword 控件 创建 修改 密码 页 面 ChangePassword.aspx。 

(1) 启动 VWD 2010， 打 开 网 站 Chapter7。 

(2) 通过 “添加 新 项 ”对 话 框 添加 名 为 ChangePassword.aspx 的 页 面 。 

(3) 切换 到 ChangePassword.aspx 的 “设计 ”视图 ， 添 加 一 个 ChangePassword 控件 ， 
设置 控件 的 ContinueDestinationPageUrl 和 CancelDestinationPageUrl 属性 均 为 ~/Index.aspx， 
即 密码 修改 成 功 或 取消 密码 修改 都 将 导航 到 网 站 的 首页 Index.aspx。 

(4) 编译 并 运行 程序 , 在 浏览 器 中 打开 ChangePassword.aspx 页 面 , 或 者 在 登录 成 功 后 ， 
单 击 “ 修 改 密码 ” 超 链接 即 可 打开 ChangePassword.aspx， 如 图 7-11 所 示 。 

(5) 在 此 输入 新 旧 密 码 ， 单 击 “ 更 改 密码 ”按钮 ， 如 果 密 码 设置 的 过 于 简单 ， 将 弹出 
如 图 7-12 所 示 的 错误 提示 。 
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图 7-11 修改 密码 图 7-12 新 密码 过 于 简单 错误 提示 


7.3 ”ASP.NET 网 站 配置 管理 


ASP.NET 应 用 程序 服务 是 可 以 在 Web 应 用 程序 中 用 来 支持 用 户 、 角 色 和 配置 文件 等 
的 一 组 服务 。 通 过 这 些 服务 可 以 管理 ASP.NET 的 安全 、 应 用 程序 和 提高 程序 等 。 


7.3.1 ASP.NET 网 站 管理 工具 


ASP.NET 网 站 管理 工具 (Web Site Administration Tool, 称 为 WSAT) 是 一 个 选项 卡 式 界 
面 的 Web 工具 ， 该 界面 将 相关 的 配置 设置 组 合 在 各 个 选项 卡 中 。 选择“ 网 站 ”|“ASPNET 
配置 ”命令 ， 即 可 打开 该 工具 ， 如 图 7-13 所 示 。 

1. “安全 ”选项 卡 

使 用 “安全 ”选项 卡 可 以 设置 和 编辑 用 户 、 角 色 和 对 站 点 的 访问 规则 ， 访 问 规则 有 助 
于 保证 网 站 内 特定 资源 的 安全 。 
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2. “应 用 程序 ”选项 卡 
在 此 页 中 可 使 用 不 希望 硬 编码 到 页 面 中 的 值 来 配置 应 用 程序 ， 使 应 用 程序 可 以 发 送 电 
子 邮件 、 配 置 调试 、 设 置 默认 错误 页 ， 以 及 停止 或 启动 应 用 程序 。 具 体 包括 如 下 设置 。 

e 应 用 程序 设置 : 这 些 设置 是 要 集中 存储 并 通过 代码 从 网 站 中 的 任意 位 置 来 访问 的 名 
称 / 值 对 。 

e° SMTP 设置 : 设置 网 站 如 何 发 送 电子 邮件 。 

e 应 用 程序 状态 : 可 以 设置 使 网 站 脱 机 ， 以 执行 维护 或 使 新 的 Microsoft SQL Server 
Standard 版 本 数据 库 联 机 。 

o 调试 和 跟踪 : 可 以 设置 调试 和 跟踪 选项 , 还 可 以 定义 默认 的 错误 页 来 报告 .aspx 错误 。 


ecslkest 


ASP 网 站 于 理工 上 saem: OB 


JAER 


欢迎 使 用 网 站 管理 工具 


RIME :/Chapter7 
当前 用 户 名 :ZHAOWDMINISTRATOR 


ze yatai Rh ip4k Fl”. AENA NOR. 
现 有 用 户 : 1 


HEF IE L a Sp s w: 3 
拉 供 程序 配置 使 您 能 名 指定 存 傅 网 站 所 用 的 管理 效 老 的 位 置 和 方式 * 


w 


za [ — n- sam + 


图 7-13 ASP.NET 网 站 配置 管理 工具 主页 面 


3. “提供 程序 ”选项 卡 

使 用 “提供 程序 ”选项 卡 可 以 配置 网 站 管理 数据 (如 成 员 资 格 ) 的 存储 方式 。 可 以 对 站 
点 的 所 有 管理 数据 只 使 用 一 个 提供 程序 ， 也 可 以 为 每 种 功能 指定 不 同 的 提供 程序 。 

数据 库 提 供 程序 是 为 特定 功能 存储 应 用 程序 数据 时 所 调用 的 类 。 默 认 情 况 下 ， 网 站 管 
理工 具 配置 并 使 用 网 站 的 App_Data 文件 夹 中 的 本 地 SQL Server Express 数据 库 。 也 可 以 选 
择 使 用 其 他 提供 程序 来 存储 成 员 资格 和 角色 管理 。 


732 使 用 WSAT 管理 用 户 


使 用 WSAT 可 以 完成 下 列 任务 : 
管理 用 户 ; 
管理 角色 ; 
管理 访问 规则 一 一 如 决定 什么 用 户 可 访问 什么 文件 和 文件 夹 ; 
配置 应 用 程序 、 邮 件 和 调试 设置 ; 
o 使 站 点 脱 机 ， 这 样 用 户 就 不 能 请 求 任何 页 面 ， 而 是 获得 一 个 友好 的 错误 消息 。 
使 用 WSAT 所 作 的 一 些 更 改 将 保存 在 应 用 程序 的 web.config 文件 中 .而 其 他 一 些 设置 ， 
如 创建 的 用 户 和 角色， 存储 在 已 配置 的 提供 者 的 数据 库 中 。 
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1. 管理 用 户 和 角色 


例 7-6: 使 用 WSAT 管理 用 户 账户 和 角色 。 

(1) 启动 VWD 2010， 打 开 网 站 Chapter7。 

(2) 选择 “网 站 ”|“ASPNET 配置 ”命令 ， 打 开 ASP.NET 网 站 管理 工具 。 切 换 到 “ 安 
全 ”选项 卡 ， 如 图 7-14 所 示 。 
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图 7-14 ASPNET 网 站 配置 管理 工具 “安全 ”选项 卡 


该 页 的 下 半 部 分 为 3 个 区 域 : “用 户 ”、“ 角 色 ” 和 “访问 规则 ”。 在 “用 户 ” 区 域 
下 方 有 “创建 用 户 ” 和 “管理 用 户 ” 链 接 。 如 果 没 有 这 些 链接 ， 而 是 显示 一 个 有 关 Windows 
身份 验证 的 提示 ， 那 么 ， 可 以 单 击 “ 选 择 身份 验证 类 型 ”链接 ， 然 后 选择 “通过 Internet” 
选项 ， 最 后 单 击 “ 完 成 ”按钮 ， 即 可 得 到 如 图 7-14 所 示 的 页 面 。 

(3) 在 “角色 ”区 域 ， 单 击 “ 启 用 角色 ”链接 ， 将 为 网 站 启用 角色 管理 ， 同 时 ， 页 面 
将 刷新 ， 出 现 “禁用 角色 ”和 “创建 或 管理 角色 ”链接 。 单 击 “ 创 建 或 管理 角色 ”链接 ， 
打开 如 图 7-15 所 示 的 “创建 新 角色 ”页 面 。 
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图 7-15 创建 新 角色 


(4) 输入 Admin 作为 新 的 角色 名 并 单 击 “ 添 加 角色 ”按钮 。 这 时 将 出 现 新 的 角色 。 单 
击 右 下 角 的 “上 一 步 ” 按 钮 ， 返 回 主 “ 安 全 ”页 面 ， 可 以 看 到 “ 现 有 角色 ” 数 发 生 了 变化 。 

角色 的 设置 也 位 于 config 文件 中 。 不 过 ， 它 默认 是 不 开启 的 ， 经 过 上 述 操作 后 ， 在 
web.config 文件 的 <system.web> 元 素 中 将 自动 添加 了 如 下 <roleManager> 元 素 : 
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<roleManager enabled="true" /> 


6) 单 


击 “ 用 户 ” 区 域 下 方 的 “创建 用 户 ” 链 接 。 打 开 “ 创 建 用 户 ” 页 面 ， 在 该 页 面 


中 输入 新 用 户 的 详细 信息 并 将 该 用 户 指派 给 Admin 角色 ， 如 图 7-16 所 示 。 
这 里 输入 的 用 户 名 是 zhaoyd， 密 码 需要 满足 之 前 配置 的 密码 规则 ， 并 且 选 择 右 侧 角色 
列表 中 的 Admin 角色 名 。 


(©) 单 


击 “ 创 建 用 户 ”按钮 将 该 用 户 添加 到 系统 中 ， 接 着 单 击 确认 页 面 上 的 “继续 ” 


按钮 完成 用 户 创建 。 
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图 7-16 创建 用 户 


(7) 单 击 右 下 角 的 “上 一 步 ” 按 钮 ， 返 回 到 主 “ 安 全 ”页 面 。 单 击 “ 管 理 用 户 ” 链 接 。 
将 打开 管理 用 户 页 面 , 该 页 面 会 显示 系统 中 所 有 用 户 , 包括 前 面 创建 的 用 户 zhaoyd 和 通过 
Register.aspx 页 面 注册 的 用 户 ， 如 图 7-17 所 示 。 
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图 7-17 管理 用 户 页 面 


可 以 启用 、 禁 用 、 编 辑 和 删除 已 有 用 户 。 通 过 单 击 “ 编 辑 角色 ”链接 ， 可 以 更 


改 指派 给 用 户 的 角色 。 使 用 用 户 列 表 上 方 的 筛选 控件 和 字母 表 ， 在 面 对 大 量 用 户 账户 时 可 
以 快速 搜索 特定 用 户 。 

(8) 返回 VWD 2010。 在 “服务 器 资源 管理 器 ”窗口 中 ， 打 开 ASPNETDB.MDF 数据 
库 ， 展 开 “ 表 ”节点 ， 右 击 aspnet Roles 表 ， 从 弹出 的 快捷 菜单 中 选择 “显示 表 数 据 ” 命 


令 ， 可 以 


看 到 前 面 创建 的 角色 Admin， 用 相同 的 方法 打开 aspnet Membership 和 
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aspnet UsersInRoles 表 ， 可 以 看 到 创建 的 用 户 以 及 角色 和 用 户 的 关系 。 
2. 创建 访问 规则 


创建 了 用 户 和 角色 后 ， 就 可 以 为 用 户 或 角色 指定 特定 的 权限 。 

例 7-7: 使 用 WSAT 创建 访问 规则 。 

(1) 启动 VWD 2010， 打 开 网 站 Chapter7。 

(2) 打开 ASP.NET 网 站 管理 工具 并 切换 到 “安全 ”选项 卡 。 

(3) 在 “访问 规则 ”区 域 中 单 击 “创建 访问 规则 ”链接 ， 打 开 “ 添 加 新 访问 规则 ”页 
面 ， 在 此 页 面 中 可 以 设置 网 站 的 某 个 目录 的 访问 规则 ， 人 允许 或 者 拒绝 指定 的 角色 或 用 户 具 
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图 7-18 添加 新 访问 规则 页 面 


(4) 单 击 “ 确 定 ” 按 钮 即 可 添加 新 的 访问 规则 ， 添 加 了 上 述 规则 后 ， 在 相应 的 子 目录 
下 会 创建 web.config 文件 ， 并 在 <system.web> 元 素 下 生成 相应 的 规则 ， 示 例如 下 : 
<system.web> 
<authorization> 
<allow roles="Admin" /> 
</authorization> 
</system.web> 


这 样 创 建 的 访问 规则 有 一 个 缺点 :就 是 它 将 安全 设置 存储 在 不 同 的 web.config 文件 中 ， 
配置 的 每 个 子 文件 夹 都 有 一 个 。 
3. 使 用 <location> 元 素 


除了 通过 WSAT 来 添加 访问 规则 以 外 ，ASP.NET 还 允许 使 用 <location> 元 素 将 相同 的 
设置 配置 到 主 web.config 文件 中 。<location> 元 素 有 一 个 path 属性 ， 它 可 以 指向 要 进行 不 
同 配置 的 文件 或 文件 夹 。 也 可 以 对 web.config 文件 的 其 他 许多 (但 并 非 全 部 ) 设 置 使 用 
<location> 元 素 。 

例 7-8: 使 用 <location> 元 素 设置 日 录 的 访问 权限 。 

(1) 启动 VWD 2010， 打 开 网 站 Chapter7。 
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(2) 在 网 站 根 目录 下 新 建 一 个 文件 夹 Private。 通过 <location> 元 素 设置 只 有 Admin 角色 
可 以 访问 该 目录 。 

(3) 打开 站 点 根 文件 夹 下 的 web.config 文件 。 在 </configuration> 结 束 标记 之 前 , 添加 一 
个 <location> 元 素 ， 设 置 其 path 属性 为 Private， 然 后 输入 如 下 配置 信息 : 


<location path="Private"> 
<system.web> 
<authorization> 
<allow roles="Admin" /> 
<deny users="*" /> 
</authorization> 
</system.web> 
</location> 


(4) 保存 并 关闭 web.config 文件 。 

(5) 打开 例 7-2 中 创建 的 Index.aspx 页 面 , 切换 到 “设计 ”视图 , 选择 LoginView 控件 ， 
然后 打开 其 任务 面板 。 在 该 面板 顶部 ， 单 击 “ 编 辑 RoleGroups” 链 接 ， 如 图 7-19 所 示 。 

(6) 在 打开 “RoleGroup 集合 编辑 器 ” 对话 框 中 , 单 击 “ 添 加 ”按钮 插入 一 个 新 的 成 员 ， 
然后 设置 该 组 的 Roles 属性 为 Admin， 如 图 7-20 所 示 。 


LoginViewl 本 Le 本 
:省 注册 为 金 百合 网 站 的 新 用 户 ] li ET 
确定 取消 
图 7-19 选择 “编辑 RoleGroups” 选 项 图 7-20 “RoleGroup 集合 编辑 器 ”对 话 框 


(7) 单 击 “ 确 定 ” 按 钮 ， 即 可 创建 RoleGroup， 同 时 返回 页 面 的 “设计 ”视图 。 

(8) 接 下 来 ， 在 LoginView 的 任务 面板 中 的 “视图 ”下 拉 列 表 中 将 出 现 RoleGroup[0]- 
Admin 选项 ， 如 图 7-21 所 示 。 选 择 该 选项 ， 即 可 编辑 相应 的 模板 ， 添 加 只 对 Admin 角色 
可 见 的 内 容 。 

(9) 此 处 添加 一 个 HyperLink 控件 到 LoginView 中 ， 设 置 该 控件 的 Text 属性 为 “管理 
员 站 点 ”，NavigateUrl 属性 为 “~/Private/Defaultaspx”。 完 成 后 ， 生 成 的 LoginView 控件 
的 代码 如 下 : 


<asp:LoginView ID="LoginView1" runat="server"> 
<AnonymousTemplate> 
你 还 没有 登录 ， 是 否 <asp:HyperLink ID="HyperLinkl" runat="server" 
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NavigateUrl=-"~/Register.aspx"> 注 册 </asp:HyperLink> 为 金 百 合 网 站 的 新 


</AnonymousTemplate> 
<LoggedInTemplate> 
<asp:LoginName ID="LoginNamel" runat="server" FormatString- "欢迎 你 ，{0}" 伺 
<br 记 你 可 以 
<asp:HyperLink ID="HyperLink2" runat="server" 
NavigateUrl="~/ChangePassword.aspx"> 修 改 密码 </asp:HyperLink> 
</LoggedInTemplate> 
<RoleGroups> 
<asp:RoleGroup Roles=" Admin"> 
<ContentTemplate> 
<asp:HyperLink ID="HyperLink3" runat="server" 
NavigateUrl="~/Private/Default.aspx"> 管 理 员 站 点 </asp:HyperLink> 
</ContentTemplate> 
</asp:RoleGroup> 
</RoleGroups> 
</asp:LoginView> 


(10) 在 Private 文件 夹 下 新 建 名 为 Default.aspx 的 页 面 , 也 就 是 Admin 角色 登录 可 访问 
的 页 面 ， 读 者 可 自行 设计 该 页 。 

(11) 保存 所 有 更 改 ， 编 译 并 运行 程序 ， 在 浏览 器 中 打开 站 点 的 首页 Index.aspx， 以 
Admin 角色 的 用 户 登 录 , 即 可 看 到 刚才 设计 的 <RoleGroups> 模 板 中 的 内 容 ， 2 71-22 所 示 。 
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图 7-21 视图 列表 新 增 了 RoleGroups 选项 ”图 7-22 Admin 角色 用 户 登录 成 功 后 的 页 面 


(12) 单 击 “ 管 理 员 站 点 ”链接 ， 可 跳 转 到 Private 目录 下 的 Default.aspx 页 面 。 


733 ”以 编程 方式 检查 角色 


wE 
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尽管 可 以 很 容易 地 使 用 LoginView 控件 在 运行 时 为 不 同 用 户 展示 不 同 内 容 ， 但 它 并 不 
是 能 满足 所 有 要 求 。 有 时 , 还 需要 根据 某 人 的 角色 成 员 资格 以 编程 方式 控制 显示 的 数据 。 
有 如 下 两 种 方法 可 以 访问 当前 用 户 的 角色 信息 。 

e 可 以 通过 当前 页 面 或 用 户 控件 访问 User 属性 的 IsInRole 方法 ， 如 下 所 示 : 


if (User.IsInRole("Admin")) 


{ 
/do something 
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e 可 访问 包含 可 直接 访问 的 大 量 静 态 方法 的 Roles 类 。 如 下 所 示 : 


if (Roles.IsUserInRole(" Admin")) 
{ 

// do something 
} 


提示 : 
如 上 述 代码 所 示 ， 要 使 用 Roles 类 ， 则 必须 启用 “角色 管理 *， 并 在 使 用 该 类 的 代码 文 
件 中 使 用 using 语句 引入 其 所 在 的 命名 空间 System.Web.Security。 


除了 IsUserInRole 方法 ,Roles 类 还 包含 了 大 量 其 他 方法 , 这 些 方 法 允许 用 户 以 编程 的 
方式 使 用 角色 。 例 如 ， 可 以 创建 和 删除 角色 、 将 用 户 指派 给 角色 或 从 角色 中 删除 用 户 ， 以 
及 获取 指派 给 某 一 特定 角色 的 用 户 列 表 。 


7.4 本 章 小 结 


本 章 介绍 了 网 站 安全 性 相关 的 基础 知识 ， 包 括 ASP.NET 验证 方式 、ASP.NET 应 用 程 
序 服务 、 登 录 控 件 的 使 用 以 及 ASP.NET 网 站 管理 工具 的 使 用 。ASP.NET 站 点 中 的 安全 性 
可 以 通过 一 些 技术 来 实现 , 包括 Windows 身份 验证 、 第 三 方 身份 验证 和 使 用 Forms 身份 验 
证 。ASP.NET 4 中 包含 7 个 登录 控件 ， 每 个 都 有 不 同 的 用 途 。 有 了 登录 控件 ， 只 需 很 少 的 
工作 量 就 可 以 构建 安全 的 Web 站 点 。 通过 本 章 的 学 习 , 读者 应 掌握 网 站 安全 性 相关 的 基础 
知识 ， 学 会 登录 控件 的 使 用 ， 并 能 通过 ASPNET 网 站 管理 工具 设置 站 点 的 安全 性 。 


75 思考 和 练习 


1. 身份 验证 和 授权 的 区 别 是 什么 ? 

2. 简 述 ASP.NET 的 验证 方式 。 

3. LoginView 和 LoginStatus 控件 的 区 别 是 什么 ? 
4. 如 何 启 用 站 点 的 角色 管理 ? 


第 8 章 ASP.NET AJAX 


Ajax 是 一 种 应 用 广泛 而 且 十 分 有 趣 的 技术 ， 它 可 以 给 站 点 增加 许多 功能 。ASP.NET 
AJAX 采用 异步 编程 方式 ， 能 够 实现 对 客户 端 脚 本 的 自动 管理 。 利 用 ASP.NET AJAX 服务 
器 控件 ， 可 以 实现 局 部 页 面 更 新 的 效果 。 本 章 首先 将 介绍 ASP.NET AJAX 的 基本 知识 ， 然 
后 详细 讲解 ASP.NET AJAX 服务 器 控件 的 使 用 方法 。 通 过 本 章 的 学 习 ， 读 者 将 掌握 
ASP.NET AJAX 提供 的 各 种 服务 器 控件 的 用 法 ， 以 及 使 用 客户 端 ASP.NET AJAX Library, 

本 章 学 习 目 标 : 

了 解 ASP.NET AJAX 的 基本 知识 

使 用 UpdatePanel 控件 

使 用 UpdateProgress 控件 通知 用 户 Ajax 操作 的 进程 
使 用 Timer 控件 

使 用 客户 端 ASP.NET AJAX Library 


8.1 AJAX 人 门 


本 书 已 经 介绍 了 浏览 器 如 何 与 服务 器 进行 交互 。 浏 览 器 使 用 GET 或 POST 方法 来 请 求 
页 面 ， 服 务 器 处 理 该 页 面 ， 并 回 发 生成 的 HTML 代码 。 然 后 ， 浏 览 器 解析 该 HTML 代码 
并 将 页 面 呈 现 给 用 户 , 并 有 选择 地 下 载 任意 的 外 部 资源 , 如 图 像 、 脚 本 文件 和 Css 样式 表 。 
当 用 户 与 页 面 交互 时 (如 通过 单 击 按钮 来 提交 一 个 已 填 好 信息 的 联系 表单 )， 页 面 被 回 发 给 
服务 器 ， 之 后 浏览 器 会 再 次 加 载 整个 页 面 。 

尽管 上 述 模型 已 经 在 Web 页 面 中 使 用 很 多 年 了 ， 但 是 它 仍然 存在 一 些 缺 点 。 首 先 ， 因 
为 整个 页 面 是 在 回 发 后 被 加 载 的 , 因此 发 送 到 浏览 器 的 HTML 代码 量 要 远大 于 浏览 器 所 需 
要 的 ; 加 载 整个 页 面 的 另 一 个 缺点 与 浏览 器 显示 页 面 的 方式 有 关 , 由 于 整个 页 面 被 替换 掉 ， 
因此 浏览 器 会 不 得 不 关闭 旧 页 面 ， 再 打开 新 页 面 ， 这 样 就 会 使 页 面 “闪烁 ”， 从 而 使 其 页 
面 失去 对 用 户 的 吸引 力 。Ajax 就 是 为 了 解决 上 述 两 个 问题 而 产生 的 。 


8.1.1 AJAX 简介 


Ajax(Asynchronous JavaScript and XML) 技 术 是 由 Jesse James Garrett 提出 的 , 是 综合 异 
步 通 信 、JavaScript 以 及 XML 等 多 种 网 络 技术 新 的 编程 方式 。 如 果 从 用 户 角 度 看 到 的 实际 
效果 来 看 ， 也 可 以 形象 地 称 之 为 无 页 面 刷 新 技术 。 

Ajax 技术 的 主要 内 容 包 括 :基于 Web 标准 XHTML+CSS 的 表示 ;使 用 DOM(Document 
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Object ModeD) 进 行动 态 显示 及 交互 ; 使 用 XML 和 XSLT 进行 数据 交换 及 相关 操作 ; 使 
XMLHttpRequest 进行 异步 数据 检索 ; 使 用 JavaScript 将 所 有 的 东西 绑 定 在 一 起 等 。 
Ajax 技术 的 最 大 优点 是 能 在 不 更 新 整个 页 面 的 前 提 下 维护 数据 。 这 使 得 Web 应 用 程 
序 可 以 更 为 迅捷 地 回应 用 户 动 作 ， 并 避免 了 在 网 络 上 发 送 那些 没有 改变 过 的 信息 。 
要 使 用 Ajax 功能 增强 Web 站 点 ， 可 以 选择 不 同 的 Ajax 架构 。 其 中 许多 架构 都 能 提供 
一 组 功能 和 工具 ， 包 括 用 于 在 浏览 器 和 服务 器 端 激活 Ajax 的 客户 端 JavaScript 架构 。 


8.1.2 ASPNET AJAX 


2005 年 , Microsoft 公司 在 专业 开发 人 员 大 会 上 宣布 将 在 ASP.NET 上 实现 Ajax 功能 ( 开 
发 代号 为 Atlas)， 主 要 是 为 了 充分 利用 客户 端 JavaScript、DHTML 和 XMLHttpRequest 对 
象 。 目 的 是 帮助 开发 人 员 创建 更 具 交 互 性 的 支持 Ajax 的 Web 应 用 程序 。 直 到 2007 年 1 H, 
Microsoft 公司 才 真 正 推出 了 具有 Ajax 风格 的 异步 编程 模型 ， 这 就 是 ASP.NET AJAX 1.0。 
同时 ， 为 了 与 其 他 的 Ajax 技术 区 分 ，Microsoft 公司 用 大 写 的 AJAX， 并 在 其 前 面 加 上 
ASPNET。 

ASPNET AJAX 1.0 是 以 可 以 在 ASPNET 2.0 之 上 安装 的 单独 下 载 的 形式 发 布 的 。 
从 .NET Framework 3.5 开始 , 所 有 这 些 特性 都 成 为 ASP.NET 所 固有 的 ， 这 意味 着 在 构建 或 
部 署 应 用 时 ， 不 再 需要 下 载 和 安装 单独 的 ASP.NET AJAX 安装 文件 。 

TE ASP.NET 4 中 , 它 被 完全 集成 在 NET 4 Framework 和 VWD 2010 中 , 并 且 与 其 他 客 
户 端 架 构 ( 包 括 jQuery) 具 有 很 好 的 互 操作 性 。 

通过 ASP.NET AJAX， 开 发 人 员 可 以 实现 如 下 功能 。 

e 创建 无 闪烁 页 面 ， 它 们 允许 刷新 部 分 页 面 ， 而 不 需要 全 部 重 载 ， 也 不 会 影响 页 面 的 
在 这 些 页 面 刷新 过 程 中 给 用 户 提供 反馈 。 
更 新 部 分 页 面 ， 使 用 计时 器 按 计划 调用 服务 器 端的 代码 。 
访问 服务 器 端 Web 服务 和 页 面 方法 ， 使 用 它们 返回 的 数据 。 
使 用 富 客户 端 编程 架构 访问 和 修改 页 面 中 的 元 素 ， 访 问 代码 模型 和 典型 系统 。 

ASP.NET AJAX 包括 两 个 重要 的 部 分 : ASP.NET AJAX 服务 器 控件 和 客户 端 ASP.NET 
AJAX Library. 

对 于 Web 开发 来 说 ， ASP.NET AJAX 从 基础 框架 实现 ， 到 客户 端 与 服务 器 的 通信 ， 会 
发 生 非常 大 的 变化 。 相 对 于 ASP.NET Kit, ASP.NET AJAX 是 一 种 更 为 成 熟 的 Web 开发 
技术 。 下面 将 介绍 ASP.NET AJAX 的 主要 控件 ScriptManager、UpdatePanel、UpdateProgress 
和 Timer 的 使 用 方法 。 


82 ”使 用 AJAX 控件 


ASP.NET AJAX 完全 综合 集成 到 了 ASP.NET 和 VWD 中 ,这 就 意味 着 可 以 立刻 开始 使 
用 它 。 对 于 在 VWD 中 创建 的 每 个 新 的 ASPNET 4 Web 站 点 来 说 ， 它 们 的 Ajax 功能 都 已 
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经 被 激活 了 。 此 外 ， 工 具 箱 中 包含 一 个 AJAX Extensions 类 别 ， 该 类 别 中 包含 了 要 在 页 面 
中 使 用 的 与 Ajax 相关 的 控件 。VWD 还 对 ASP.NET AJAX 提供 了 大 力 支 持 , 它 为 服务 器 端 
的 控件 和 客户 端的 JavaScript 代码 提供 了 “智能 提示 ”功能 。 


8.2.1 ScriptManager 控件 


ScriptManager 控件 是 ASP.NET AJAX 的 核心 ， 它 提供 处 理 页 面 上 的 所 有 ASP.NET 
AJAX 控件 (UpdatePanel、UpdateProgress 等 ) 的 支持 ,没有 该 控件 的 存在 其 他 ASP.NET AJAX 
控件 是 不 能 工作 的 ， 并 且 所 有 需要 支持 ASP.NET AJAX 的 ASP.NET 页 面 上 只 能 有 一 个 
ScriptManager 控件 。 此 外 ，ScriptManager 控件 还 可 以 生成 相关 的 客户 端 代理 脚本 以 便 能 够 
在 客户 端 脚 本 中 访问 Web 服务 。 

1. ScriptManager 控件 的 属性 


ScriptManager 类 有 许多 属性 ， 其 中 大 多 数 都 用 于 高 级 场景 。 在 很 多 情况 下 ， 不 需要 改 
变 ScriptManager 类 的 任何 属性 。 而 在 有 些 情况 下 ， 则 需要 改变 或 设置 它 的 某 些 属性 。 表 
8-1 列 出 了 ScriptManager 控件 的 一 些 常见 属性 。 


表 8-1 ScriptManager 控件 的 重要 属性 
g 性 说 了 明 
该 属性 确定 Ajax 运行 过 程 中 出 现 的 错误 是 否 会 导致 加 载 自 定义 的 错 
误 页 面 。 默 认为 True; 设置 为 False 时 ， 错 误 在 浏览 器 中 显示 为 
JavaScript 通知 窗口 ， 或 者 在 禁止 调试 时 对 客户 端 隐藏 。 注 意 ， 如 果 
没有 配置 任何 自 定义 错误 页 面 ， 错 误 就 总 是 显示 为 JavaScript 通知 
异步 回 传 发 生 错误 时 的 错误 信息 。 如 果 没 有 使 用 自 定义 错误 页 面 ， 这 
AsyncPostBackErrorMessage 个 属性 允许 自 定义 错误 消息 ， 当 发 生 Ajax 错误 时 ， 用 户 可 以 看 到 这 
条 错误 消息 
AsyncPostBackTimeout 异步 回 传 时 超时 限制 ， 默 认 值 为 90， 单 位 为 秒 
这 个 属性 确定 是 否 允 许 客户 端 代码 调用 页 面 内 定义 的 方法 。 后 面 将 讨 
论 其 工作 原理 
该 属性 确定 ScriptManager 是 否 支持 使 用 UpdatePanel 控件 呈现 部 分 页 
面 。 除 非 想 阻止 整个 页 面 的 部 分 更 新 ， 否 则 应 该 将 它 设置 为 True 
若 该 属性 设置 为 True， ASP.NET 将 会 包含 微软 的 Content Delivery 
Network 站 点 上 (而 不 是 自己 的 服务 器 上 ) 的 客户 端 框架 文件 的 链接 。 
EnableCdn 这 样 可 以 节省 一 些 带宽 ， 如 果 用 户 已 经 从 使 用 这 些 文件 的 其 他 站 点 那 
里 获取 了 这 些 文件 的 高 速 缓存 副本 的 话 ， 这 样 做 还 可 能 会 提高 页 面 首 
次 加 载 时 的 速度 
该 属性 用 于 确定 是 否 包 含 Microsoft AJAX 客户 端 库 。 人 允许 使 用 
MicrosoftAjaxMode ScriptManager 控件 完成 与 服务 器 相关 的 任务 (如 注册 客户 端 脚本 )， 而 
不 需要 在 页 面 中 嵌入 客户 端 框架 


AllowCustomErrorsRedirect 


EnablePageMethods 


EnablePartialRendering 
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CEK) 
属 性 说 BB 
指定 ScriptManager 发 送 到 客户 端的 脚本 的 模式 ， 有 4 种 模式 : Auto, 
ScriptMode 
Inherit, Debug 和 Release， 默 认 值 为 Auto 
设置 所 有 脚本 块 的 根 目录 ， 作 为 全 局 属性 ， 包 括 自 定义 的 脚本 块 或 者 
ScriptPath 引用 第 三 方 的 脚本 块 。 如 果 在 Scripts 中 的 <asp:ScriptReference /> 标签 
中 设置 了 Path 属性 ， 它 将 覆盖 该 属性 
Sini ScriptManager 控件 的 <Scripts> 子 元 素 允 许 添加 客户 端 在 运行 时 必须 
cripts 
P 下 载 的 其 他 的 JavaScript 文件 
和 <Scripts> 元 素 一 样 ，<CompositeScrip 马 元素 也 允许 添加 其 他 的 
. . JavaScript 文件 。 但 是 ， 在 <Composite- Scrip 人 > 元 素 下 注册 的 文件 都 被 
CompositeScript i b: 
合并 为 一 个 单独 的 、 可 下 载 的 文件 ， 从 而 可 以 减 小 网 络 开销 并 提高 页 
Services <Services> 元 素 人 允许 定义 客户 端 页 面 能 够 访问 的 Web 服务 
异步 回 传 发 生 异 常 时 的 服务 端 处 理 函 数 , 在 这 里 可 以 捕获 信息 并 作 相 
OnAsyncPostBackError 


应 的 处 理 
指定 ResolveScriptReference 事件 的 服务 器 端 处 理 函 数 , 在 该 函数 中 可 


OnResolveScriptReference sN N j @ 
以 修改 某 一 条 脚本 的 相关 信息 如 路 径 和 版 本 等 


ScriptManager 控件 是 客户 端 页 面 和 服务 器 之 间 的 桥梁 。 它 管理 脚本 资源 (客户 端 使 用 
的 JavaScript 文件 )， 负 责 部 分 页 面 的 更 新 (如 前 所 述 ) 以 及 处 理 与 Web 站 点 的 交互 ， 如 Web 
服务 和 ASP.NET 应 用 程序 服务 (如 成 员 、 角 色 和 配置 文件 )。 


说 明 : 

如 果 认 为 只 在 一 小 部 分 页 面 上 需要 Ajax 性 能 ， 那 么 通常 可 以 将 ScriptManager 控件 直 
接 放 置 到 内 容 页 中 。 但 是 ， 也 可 以 将 ScriptManager 控件 放置 在 母 版 页 中 ， 这样 它 便 在 整个 
站 点 中 都 可 用 。 

2. ScriptManager 控件 的 用 法 


要 使 用 ASP.NET AJAX 提供 的 功能 ， 必 须 在 网 页 中 包含 一 个 ScriptManager 控件 。 添 
加 ScriptManager 控件 后 ， 将 生成 如 下 代码 : 


<asp:ScriptManager ID="ScriptManagerl" runat="server"> 
</asp:ScriptManager> 


在 介绍 完 UpdatePanel 控件 后 ， 将 一 起 举例 说 明 ScriptManager 控件 的 用 法 。 
8.2.2 UpdatePanel 控件 


UpdatePanel 控件 是 ASP.NET AJAX 中 最 重要 的 一 个 控件 ， 它 可 以 用 来 创建 局 部 更 新 
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的 Web 应 用 程序 。 有 了 UpdatePanel 控件 ， 开 发 者 不 需要 编写 任何 客户 端 脚本 ， 只 需 在 页 
面 上 添加 UpdatePanel 控件 和 ScriptManager 控件 就 可 以 自动 实现 局 部 更 新 。 
1. UpdatePanel 控件 的 工作 原理 


UpdatePanel 控件 的 工作 过 程 如 图 8-1 所 示 。 


服务 器 端 EPK 
D MyPage.aspx 入 Clent 
<asp:ScriptManager <div 1d="UP1"/> 
ssni” Original panel content 
wura <input type="submit" 
runat="server"/> name="B1" 


<asp:UpdatePanel Request aaa uii 
1d=-UPI- <w> 
UpdateMode=" Conditional" 
runat="server"> Response 
<ContentTemplate> All content 
cl-- Other panel content --> ® 
<aspiutton -a Ml y) 
iati eques! 
Text=*Submit" 异步 回 发 <div 1d="UP1"/> 
Updated panel content 
runat="server"/> <input type="submit" 
</ContentTemplate> Response name="81" " 
</asp:UpdatePanel> 局 部 更 新 et 


</div> 


图 8-1 UpdatePanel 控件 的 工作 原理 
当 客户 端 向 服务 器 第 1 次 发 出 请 求 时 ， 服 务 器 返回 整个 页 面 。 除 此 之 外 ， 均 通过 异步 
回 传 方式 对 页 面 进行 局 部 更 新 。 
2. UpdatePanel 控件 的 属性 
UpdatePanel 控件 常用 属性 如 表 8-2 所 示 。 


表 8-2 UpdatePanel 控件 的 重要 属性 
说 了 明 

该 属性 确定 位 于 UpdatePanel 内 的 控件 能 否 刷新 UpdatePanel。 其 默认 值 是 True, 
当 该 值 设 置 为 False 时 ， 必 须 将 UpdateMode 设置 为 Conditional。 注 意 ， 当 设置 为 
False 时 ，UpdatePanel 内 定义 的 控件 仍然 会 引发 到 服务 器 的 回 发 ， 只 是 不 再 自动 更 
新 面板 
Triggers 集合 包含 PostBackTrigger 和 AsyncPostBackTrigger 元 素 。 如 果 要 实现 完整 
的 页 面 刷 新 ， 那 么 就 可 以 用 第 一 个 ， 而 如 果 要 使 用 在 面板 之 外 定义 的 控件 更 新 
UpdatePanel， 则 用 第 二 个 


ChildrenAsTriggers 


Triggers 


该 属性 表示 UpdatePanel 最 终 呈 现 的 HTML 元 素 。Block( 默 认 ) 表 示 <div>，Inline 
RenderMode 


表示 <span> 
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( 续 表 ) 
说 
该 属性 表示 UpdatePanel 的 更 新 模式 ， 有 两 个 选项 : Always 和 Conditional. Always 
是 不 管 有 没有 Trigger， 其 他 控件 都 将 更 新 该 UpdatePanel, Conditional 表示 只 有 当 
前 UpdatePanel 的 Trigger 或 ChildrenAsTriggers 属性 为 true 时 当前 UpdatePanel 中 
控件 引发 的 异步 回 送 或 者 整 页 回 送 ， 或 是 服务 器 端 调用 Update0 方 法 才 引 发 更 新 
该 属性 在 “属性 ”面板 中 不 可 见 ， 但 它 是 UpdatePanel 的 一 个 重要 属性 。 它 是 
容器 , 用 于 定义 UpdatePanel 的 内 容 , 可 以 将 控件 放置 在 该 容器 中 作为 UpdatePanel 
的 子 控件 。 如 果 忘 记 了 这 个 必需 的 ContentTemplate 属性 ，VWD 会 发 出 一 条 警告 


UpdateMode 


个 


ContentTemplate 


3. 实现 局 部 更 新 
在 一 个 页 面 中 ， 如 果 需 要 局 部 更 新 的 内 容 较 少 ， 可 放置 一 个 UpdatePanel 控件 ， 在 该 
控件 内 实现 局 部 更 新 的 效果 。 
例 8-1: 在 UpdatePanel 中 实现 局 部 更 新 。 
(1) 启动 VWD 2010， 新 建 空 网 站 Chapter8 。 
(2) 通过 “添加 新 项 ”对 话 框 ， 添 加 一 个 名 为 AsyncFresh.aspx 的 页 面 。 
(3) 切换 到 页 面 的 “设计 ”视图 ， 添 加 一 个 ScriptManager 和 一 个 UpdatePanel 控件 。 
(4) 在 UpdatePanel 内 部 添加 一 个 Label 控件 和 一 个 Button 控件 ， 同 时 在 UpdatePanel 
外 面 也 添加 一 个 Button 控件 。 控 件 的 布局 如 图 8-2 所 示 。 
(5) 切换 到 “ 源 ” 视 图 ， 相 应 的 代码 如 下 : 
<div> 
<asp:ScriptManager ID="ScriptManagerl" runat="server"> 
</asp:ScriptManager> 
<asp:UpdatePanel ID="UpdatePanell" runat="server"> 
<ContentTemplate> 
<asp:Label ID="Labell" runat="server" Text="Label"></asp:Label> 
<br /><asp:Button ID="Button1" runat="server" Text="UpdatePanel 内 异步 刷新 " /> 
</ContentTemplate> 


</asp:UpdatePanel><br /> 
<asp:Button ID="Button2" runat="server" Text="UpdatePanel 外 " /> 


</div> 
(6) 分 别 为 两 个 Button 控件 添加 单 击 事件 处 理 程序 ， 代 码 如 下 : 


protected void Button1_Click(object sender, EventArgs e) 


í 
Labell.Text = "UpdatePanel 内 局 部 刷新 ， 当 前 时 间 : "+ DateTime Now.ToString0; 


} 
protected void Button2_Click(object sender, EventArgs e) 
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Labell.Text = "UpdatePanel 外 整个 页 面 刷新 ， 当 前 时 间 : "+ DateTime.Now.ToString(); 
} 


(7) 编译 并 运行 程序 ， 在 浏览 器 中 打开 AsyncFresh.aspx， 分 别 单 击 不 同 的 按钮 ， 观 察 
有 什么 不 同 ， 体 验 AJAX 局 部 刷新 的 效果 ， 如 图 8-3 所 示 是 局 部 刷新 无 闪烁 的 情况 。 


| 
| Æ http://1ocalhost:1082/Chapter8/AsyncFre... |- [DEY 
go- la localhost 1062 [v| | 
[XFO SEO FEV BRAW IAV WHW 
[asp:UpdatePanel#UpdatePanel1 [ =" 1 请 收 大 天。 veo /1locahost:10 a-a = ” 
Label Š wattia, 2012-7- 四 
| UpdatePane1 内 异步 刷新 | P ES Í 当前 时 间 ，2012-7-21 15:04:08 
人 mdatePanel 外 J 
lat oF ane. UpdatePanel$h 图 
Dinei no ao 
图 8-2 ”控件 布局 图 8-3 页 面 运行 效果 图 


可 以 看 到 ， 虽 然 单 击 每 个 按钮 都 能 获取 最 新 时 间 并 显示 ， 但 页 面 刷新 效果 却 不 同 。 
4. 使 用 Triggers 属性 


在 UpdatePanel 中 有 两 种 Triggers， 分 别 为 AsyncPostBackTrigger 和 PostBackTrigger。 
AsyncPostBackTrigger 用 来 指定 某 个 服务 器 控件 作为 该 UpdatePanel 的 异步 更 新 触发 器 ， 
PostBackTrigger 用 来 指定 在 UpdatePanel 中 的 某 个 服务 器 控件 作为 同步 更 新 触发 器 。 蜡 步 
更 新 触发 器 所 引发 的 回 传 叫 异 步 回 传 ， 引 发 页 面 局 部 更 新 。 而 同步 更 新 触发 器 所 引发 的 回 
传 叫 同步 回 传 ， 引 发 传统 的 整 页 回 传 。 

例 8-2: 利用 Triggers 属性 指定 服务 器 控件 的 回 传 方式 。 

(1) 启动 VWD 2010， 打 开 网 站 Chapter8 。 

(2) 通过 “添加 新 项 ”对 话 框 添加 一 个 名 为 UseTrigger.aspx 的 页 面 。 

(3) 切换 到 页 面 的 “设计 ”视图 ， 添 加 一 个 ScriptManager 和 一 个 UpdatePanel 控件 。 

(4) 在 UpdatePanel 内 部 添加 一 个 Label 控件 和 两 个 Button 控件 ， 同 时 在 UpdatePanel 
外 面 也 添加 两 个 Button 控件 。 

(5) 设置 按钮 的 Text 属性 分 别 为 “UpdatePanel 内 完整 页 面 刷新 ”、“UpdatePanel 内 
局 部 刷新 ”、“UpdatePanel 外 ”和 “UpdatePanel 外 异步 刷新 ”。 控 件 的 布局 如 图 8-4 所 示 。 

(6) 选中 UpdatePanel 控件 , 通过 “属性 ”面板 设置 Triggers 属性 , 这 是 一 个 集合 属性 ， 
单 击 属性 右 侧 的 按钮 ， 打 开 “UpdatePanelTrigger 集合 编辑 器 ”对 话 框 ， 单 击 “ 添 加 ”按钮 
右 侧 的 倒 三 角形 ,打开 一 个 下 拉 菜 单 ， 如 图 8-5 所 示 ， 可 以 添加 两 类 元 素 : PostBackTrigger 
和 AsyncPostBackTrigger 。 本 例 中 设置 Buttonl 为 PostBackTrigger ， Button4 为 
AsyncPostBackTrigger。 


技巧 : 
如 果 “ 属 性 ”面板 中 找 不 到 Triggers 属性 ， 则 可 能 是 页 面 中 没有 添加 ScriptManager 
控件 。 
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UpdatePanelTrigger 


RRV: AsyncPostBack: Buttont. Click 属性 到 ) 
e Button! o [BUDI 

ThS Buttont. Clic š 
CR © ess 


CentrelID 
EventNane 


aeti a 


[asp:UpdatePanel# UpdatePanel] 
取 当 前 时 间 
[Eee UpdatePane1/ 5898136 | - i 
UpdatePanel 外 WpdatePanel 外 异步 刷新 sassa ( má J 
图 8-4 控件 的 页 面 布局 图 8-5 “UpdatePanelTrigger 集合 编辑 器 ”对 话 框 


(7) 分 别 为 4 个 Button 控件 添加 单 击 事件 处 理 程序 ， 代 码 如 下 : 


protected void Button1_Click(object sender, EventArgs e) 


i Labell.Text= "UpdatePanel 内 整个 页 面 刷新 ， 当 前 时 间 : " + DateTime.Now.ToString(); 
S void Button2_Click(object sender, EventArgs e) 

| Labell.Text = "局 部 刷新 无 闪烁 ， 当 前 时 间 : "+ DateTime .Now.ToStringO; 

EEN void Button3_Click(object sender, EventArgs e) 

i Labell.Text= "UpdatePanel 外 整个 页 面 刷 新 ， 当 前 时 间 : "+ DateTime.Now.ToString(); 
E void Button4_Click(object sender, EventArgs e) 

' Labell.Text= "UpdatePanel 外 异步 刷新 无 闪烁 ,当前 时 间 :" + DateTime.Now.ToString(); 


(8) 编译 并 运行 程序 ， 在 浏览 器 中 打开 UseTrigger.aspx 页 面 。 分 别 单 击 不 同 的 按钮 ， 
观察 有 什么 不 同 ， 可 以 看 到 ， 使 用 了 Triggers 属性 后 ， 虽 然 Buttonl 按钮 在 UpdatePanel 内 
部 , 但 实现 的 却 是 整个 页 面 的 更 新 ， 而 在 UpdatePanel 外 面 的 Button4 按钮 却 实 现 了 局 部 刷 
新 的 效果 ， 如 图 8-6 所 示 是 单 击 Button4 后 局 部 刷新 无 闪烁 的 情况 。 


BHO” le localhost T x] “+ x 
XPD MED SEV BRAW IAD WHO č 
RRR Æ http://locslhost:10.. A-Q aw” 


Updatepanet 外 异步 刷新 无 闪烁 ， 当 前 时 间 ，2012-7-21 16:0529 “ 
UpdatePanel 内 完整 页 面 刷新 | [_UpdatePanel 内 局 部 刷新 3 


[an [ER 


[Te n Rwa 


图 8-6 UpdatePanel 外 按钮 的 局 部 刷新 
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技巧 : 

默认 情况 下 ， 在 UpdatePanel 内 部 的 服务 器 控件 采用 的 是 异步 回 传 方式 ， 实 现 
UpdatePanel 的 局 部 更 新 ; 而 在 UpdatePanel 外 部 的 服务 器 控件 采用 的 是 同步 回 传 方式 ， 实 
现 整个 页 面 的 刷新 。 而 通过 Triggers 属性 可 以 将 UpdatePanel 外 的 控件 设置 为 异步 刷新 , 所 
以 在 使 用 母 版 页 的 时 候 ， 可 以 在 母 版 页 中 放置 ScriptManager 控件 ， 在 内 容 页 使 用 
UpdatePanel， 并 通过 Triggers 属性 设置 母 版 页 中 的 控件 实现 局 部 更 新 


5. 在 同一 页 面 上 使 用 多 个 UpdatePanel 


ASP.NET 并 没有 限制 在 一 个 页 面 中 使 用 多 少 个 UpdatePanel， 所 以 可 以 为 不 同 的 区 域 
添加 不 同 的 UpdatePanel 控件 。 由 于 UpdatePanel 默认 的 UpdateMode 是 Always， 所 以 ， 如 
果 页 面 上 有 一 个 局 部 更 新 被 触发 ， 则 所 有 的 UpdatePanel 都 将 更 新 ， 要 想 只 更 新 某 个 
UpdatePanel， 只 需 把 UpdateMode 属性 设置 为 Conditional 即 可 。 

下 面 的 例子 就 包括 两 个 UpdatePanel 控件 ， 其 中 一 个 用 来 输入 数据 ， 而 另 一 个 则 用 来 
显示 数据 ， 两 个 UpdatePanel 的 UpdateMode 属性 都 设置 为 Conditional， 当 单 击 “ 添 加 ” 按 
钮 时 ， 两 个 UpdatePanel 都 更 新 ， 单 击 “ 取 消 ”按钮 时 ， 只 有 UpdatePanel2 更 新 。 

例 8-3: 同一 页 面 中 使 用 多 个 UpdatePanel. 

(1) 启动 VWD 2010， 打 开 网 站 Chapter8。 

(2) 通过 “添加 新 项 ”对 话 框 添加 一 个 名 为 MultiUpdatePanel.aspx 的 页 面 。 

(3) 切换 到 页 面 的 “设计 ”视图 ， 添 加 一 个 ScriptManager 和 两 个 UpdatePanel 控件 。 

(4) 在 UpdatePanell 内 部 添加 ListBox 控件 和 一 个 Label 控件 ，ListBox 控件 中 的 选项 
通过 UpdatePanel2 中 的 TextBox 控件 添加 ，Label 控件 用 于 显示 当前 时 间 。 

(5) 在 UpdatePanel2 中 添加 一 个 Label 控件 、 一 个 TextBox 控件 和 两 个 Button 控件 。 
其 中 ，Label 控件 还 是 用 于 显示 当前 时 间 ，TextBox 控件 用 于 输入 要 添加 到 ListBox 中 的 选 
项 值 ， 单 击 “ 添 加 ”按钮 将 添加 项 到 ListBox 中 ， 单 击 “ 取 消 ”按钮 将 清空 TextBox 控件 。 

(6) 设置 两 个 UpdatePanel 控件 的 UpdateMode 属性 为 Conditional。 设 置 UpdatePanell 
的 Triggers 属性 为 Buttonl 异步 刷新 AsyncPostBackTrigger。 

(7) 切换 到 “ 源 ” 视 图 ， 修 改 相应 的 代码 如 下 所 示 ; 

<div> 
<asp:ScriptManager ID="ScriptManagerl" runat="server"> 
</asp:ScriptManager> 
<asp:UpdatePanel ID="UpdatePanell" runat="server" UpdateMode="Conditional"> 
<ContentTemplate> 
<fieldset style="width:180px:"> 
<legend >UpdatePanell</legend> 
<asp:ListBox ID="ListBox1" runat="server" Width="108px"></asp:ListBox> 
<br/> 
<asp:Label ID="Labell" runat="server" ><%=DateTime.Now %></asp:Label> 
</ContentTemplate> 
<Triggers> 
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<asp:AsyncPostBackTrigger ControllD="Button1" EventName="Click" /> 
</Triggers> 
</asp:UpdatePanel> 
<asp:UpdatePanel ID="UpdatePanel2" runat="server"> 
<ContentTemplate> 
<fieldset style="width:180px;"> 
<legend >UpdatePanel2</legend> 
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox> 
<br/> 
<asp:Button ID="Button1" runat="server" Tex 人 "添加 " onclick="Button1_Click" /> 
<asp:Button ID="Button2" runat="server" Text=" 取 消 " onclick="Button2_Click" 这 
<br > 
<asp:Label ID="Label2" runat="server" ><%=DateTime.Now %></asp:Label> 
</ContentTemplate> 
</asp:UpdatePanel> 
</div> 


(8) 添加 两 个 Button 控件 的 事件 处 理 程序 ， 代 码 如 下 : 


protected void Button1_Click(object sender, EventArgs e) 


{ 
ListBox1.Items.Add(TextBox1.Text); 
TextBox1.Text = ""; 
} 
protected void Button2_Click(object sender, EventArgs e) 
{ 
TextBox1.Text = ""; 
) 


(9) 编译 并 运行 程序 ， 在 浏览 器 中 打开 MultiUpdatePanel.aspx 页 面 ， 在 UpdatePanel2 
中 的 TextBox 控 件 中 输入 一 个 值 , 单 击 “添加 ?按钮 ,该 值 将 添加 到 UpdatePanell 中 的 ListBox 
中 ， 同 时 ， 两 个 显示 时 间 的 Label 控件 都 进行 了 更 新 ， 如 图 8-7 所 示 。 

(10) 单 击 “取消 ”按钮 ， 将 只 更 新 UpdatePanel2， 如 图 8-8 所 示 ， 只 有 UpdatePanel2 
中 的 时 间 进 行 了 更 新 。 
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图 8-7 同时 更 新 多 个 UpdatePanel 控件 图 8-8 只 更 新 指定 的 UpdatePanel 控件 
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8.2.3 UpdateProgress 控件 


虽然 使 用 UpdatePanel 和 ScriptManager 已 经 足以 创建 无 闪烁 页 面 ,但 ASP.NET AJAX 

提供 了 更 多 控件 来 增强 用 户 在 启用 了 Ajax 的 Web 站 点 中 的 体验 。 改 进 用 户 体验 的 方法 之 
是 使 用 UpdateProgress 控件 ， 另 一 种 则 是 使 用 Timer 控件 。 

UpdateProgress 控件 一 般 与 UpdatePanel 控件 联合 使 用 , EIZE UpdatePanel 异步 更 新 过 
程 中 ， 显 示 提 示 信 息 。 这 些 信 息 可 以 是 一 段 文字 、 一 个 进度 条 或 某 个 动画 。 当 异步 更 新 完 
成 时 ， 提 示 信 息 自动 消失 。 

1. UpdateProgress 控件 的 属性 

UpdateProgress 控件 的 常用 属性 如 表 8-3 所 示 。 


表 8-3 UpdateProgress 控件 的 常用 属性 
mg 性 说 BB 
设置 哪个 UpdatePanel 控件 产生 的 回 送 会 显示 UpdateProgress 的 内 容 , 当 关联 
的 UpdatePanel 控件 忙于 刷新 时 ， 就 会 显示 在 <ProgressTemplate> 元 素 中 定义 


AssociateUpdatePanelID] 的 内 容 。 通 常 要 在 模板 中 放 入 文本 或 动画 图 像 也 接受 其 他 标记 ) 来 让 用 户 知 
道 正 在 发 生 的 事情 

DisplayAfter 当 引 发 回 送 后 多 少 毫 秒 会 显示 UpdateProgress 控件 的 内 容 ， 默 认 值 是 500 毫秒 
设置 UpdateProgress 控件 的 显示 方式 .如 果 为 tue( 默 认 值 ), 当 UpdateProgress 

DynamicLayout 控件 不 显示 的 时 候 不 占用 空间 ;为 false， 当 UpdateProgress 控件 不 显示 的 时 


候 仍然 占用 空间 
ProgressTemplate 获取 或 设置 定义 UpdateProgress 控件 内 存 的 模板 


如 果 没 有 设 定 UpdateProgress 控件 的 AssociateUpdatePanelID 属性 , 则 任何 一 个 异步 更 
新 都 会 使 UpdateProgress 控件 显示 出 来 。 相 反 ， 如 果 将 UpdateProgress 控件 的 
AssociateUpdatePanelID 属性 设置 为 某 个 UpdatePanel 控件 的 ID， 那么 只 有 该 UpdatePanel 
控件 引发 的 异步 更 新 才 会 使 相关 联 的 UpdateProgress 控件 显示 出 来 。 

注意 : 

必须 为 UpdateProgress 控件 定义 模板 ， 否 则 ， 在 UpdateProgress 控件 的 Init 事件 中 会 
抛 出 异常 。 可 以 通过 将 标记 添加 到 ProgressTemplate 元 素 ， 以 声明 的 方式 指定 
ProgressTemplate 属性 。 如 果 要 动态 创建 UpdateProgress 控件 ， 则 应 在 页 面 的 PreRender 事 
件 中 或 之 前 进行 创建 。 


2. 使 用 UpdateProgress 控件 


例 8-4: 使 用 UpdateProgress 控件 给 用 户 提供 反馈 信息 。 
(1) 启动 VWD 2010， 打 开 网 站 Chapter8。 
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(2) 通过 “添加 新 项 ”对 话 框 添加 一 个 名 为 UpdateProgress.aspx 的 页 面 。 

(3) 在 “解决 方案 资源 管理 器 ”窗口 中 ， 在 项 目 根 目 录 下 新 建 一 个 images 文件 夹 ， 然 
后 添加 进度 条 动画 文件 progress.gif 到 该 文件 夹 中 。 

(4) 切换 到 页 面 的 “设计 ”视图 ， 添加 一 个 ScriptManager、 一 个 UpdatePanel 控件 和 一 
个 UpdateProgress 控件 。 

(5) 在 UpdatePanel 控件 中 添加 一 个 Label 控件 和 一 个 Button 控件 。 其 中 ，Label 控件 
用 于 显示 当前 时 间 ， 设 置 Button 控件 的 Text 属性 为 “提交 ”。 

(6) 在 UpdateProgress 控件 中 添加 文本 “局 部 刷新 进行 中 ， 请 稍 候 …” 和 一 个 Image 
PE, Image 控件 的 ImageUrl 属性 指向 前 面 的 进度 条 动画 文件 progress.gif。 

(7) 添加 按钮 控件 的 单 击 事件 处 理 程序 ， 为 了 演示 进度 条 功能 ， 在 程序 中 等 待 3 秒 钟 

刷新 页 面 ， 代 码 如 下 : 


protected void Button1_Click(object sender, EventArgs e) 
Í 
System.Threading.Thread.Sleep(3000): //%í 3 秒 
Labell.Text = DateTime.Now.ToString(); 
) 


(8) 编译 并 运行 程序 ， 运 行 效果 如 图 8-9 所 示 。 


http://localhost:1082/Chapter8/UpdateProgress.... 


go -E localhost DI: 
HO 编辑 EE) EEV BZW IAW #R QD 
RER |Æ htp: //localhost: 10... A- A-  @- S 


2012-7-24 22:02:55 


局 部 刷新 进行 中 ， 请 稍 候 - 


@ Internet far 100 ~- 


图 8-9 ”使 用 进度 提示 控件 


本 例 中 只 有 一 个 UpdateProgress 控件 ， 但 在 实际 操作 中 也 可 以 在 一 个 页 面 中 使 用 多 个 
UpdateProgress 控件 ， 通 过 设置 AssociateUpdatePanelID 属性 来 指点 相关 联 的 UpdatePanel 
控件 。 

3. 进度 条 的 取消 功能 

UpdateProgress 控件 还 支持 另 一 个 技术 细节 ， 即 支持 取消 命令 按钮 。 当 用 户 单 击 了 “ 取 
消 ” 按 钮 时 ， 异 步 回 调 将 立即 被 终止 ， 该 UpdateProgress 控件 将 消失 ， 页 面 恢复 到 原来 的 

例 8-5: 为 进度 条 增加 “取消 ”命令 按钮 ， 当 用 户 单 击 了 “取消 ”按钮 时 ， 结 束 异 步 
回调 ， 恢 复 到 原来 的 状态 。 

(1) 启动 VWD 2010， 打 开 网 站 Chapter8。 

(2) 通过 “添加 新 项 ”对 话 框 添加 一 个 名 为 CancelUpdateProgress.aspx 的 页 面 。 


第 8 章 ASPNETAJAX 。259 。 


(3) 切换 到 页 面 的 “设计 ”视图 ， 添加 一 个 ScriptManager、 一 个 UpdatePanel 控件 和 一 
个 UpdateProgress 控件 。 

(4) 在 UpdatePanel 控件 中 添加 一 个 Label 控件 和 一 个 Button 控件 ，Label 控件 用 于 显 
示 当 前 时 间 ， 设 置 Button 控件 的 Text 属性 为 “提交 ”。 

(5) 在 UpdateProgress 控件 中 添加 文本 “局 部 刷新 进行 中 ， 请 稍 候 …” 和 一 个 Image 
控件 ，Image 控件 的 InageUrl 属性 指向 前 面 的 进度 条 动画 文件 progress.gif， 然 后 ， 继 续 添 
加 一 个 HTML 控件 Input(Button)， 设 置 按钮 的 Text 属性 为 “取消 ”。 

(6) 切换 到 “ 源 ” 视 图 ， 在 上 述 所 有 控件 的 下 面 添加 如 下 客户 端 JavaScript 代码 块 : 


<script type="text/javascript"> 
var prm = Sys. WebForms.PageRequestManager.getInstance(); 
$addHandler($get('Button2'), 'click', AbortPostBack); 
prm.add_initializeRequest(InitializeRequest); 
function InitializeRequest(sender, args) { 
if (prm.get_isInAsyncPostBack()) 
args.set_cancel(true); 
l 
function AbortPostBack() { 
if (prm.get isInAsyncPostBack()) 
prm.abortPostBack(); 
i 


</script> 
上 述 代码 将 “取消 ”按钮 的 click 事件 连接 到 AbortPostBack0 方 法 , 该 方法 用 来 取消 当 
前 的 回 发 请 求 。 
(7) 添加 “提交 ”按钮 控件 的 单 击 事件 处 理 程序 ， 代 码 如 下 : 
protected void Button1_Click(object sender, EventArgs e) 


{ 
System. Threading.Thread.Sleep(3000); // 等 待 3 秒 


Labell.Text = DateTime.Now.ToString(); 
} 


(8) 编译 并 运行 程序 ， 单 击 “ 提 交 ” 按 钮 ， 在 回 发 过 程 中 单 击 “ 取 消 ” 按 钮 ， 将 取消 


回 发 ， 页 面 恢复 到 原来 的 状态 ， 如 图 8-10 所 示 。 
[TFT Jag) Æ http://localhost: 1082/Chapter8/CancelUpdateP. .. = 吾 国 ] 
SO” [Elus /oesthost:1082/hpter/Cuneelh | x= JO [Ee sano 四 
XPO REO SEV KARA IAW 帮助 如 文件 EE S0 FEV KARU IAV #HW 
ABRE — way /ioeaiost 10 -D = @- mmo- “| | 文 wax Erme. | | A- m = @- ” 
2012-7-25 21:44:18 2012-7-25 21:44:18 
= Ea] 
局 部 刷新 进行 中 ， 请 稍 修 . )[ Ra 
@ internet ar Rios ~ Internet far Aion 


图 8-10 取消 异步 回 发 
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注意 : 
请 不 要 将 客户 端 方法 与 服务 器 端的 事件 处 理 相 混淆 :; 客户 端 方法 允许 浏览 器 捕获 相应 
的 事件 ， 并 使 用 JavaScript 代码 进行 处 理 。 这 一 过 程 根本 不 涉及 到 服务 器 端 。 事 实 上 ， 当 
用 户 取消 一 个 操作 时 ， 服 务 器 端 仍 然 或 继续 处 理 该 请 求 ， 只 是 浏览 器 此 时 已 关闭 连接 并 停 
止 监听 。 


8.2.4 Timer 控件 

Timer 控件 是 ASP.NET AJAX 中 又 一 个 重要 的 服务 器 控件 。 通 过 它 可 以 完成 局 部 页 面 
的 定时 更 新 ， 从 而 实现 局 部 页 面 定 时 刷新 、 图 片 自动 播放 以 及 超时 自动 退出 等 功能 。 

1. 属性 和 事件 

Timer 控件 常用 属性 和 事件 如 表 8-4 所 示 。 


表 8-4_Timer 控 件 的 常用 属性 和 事件 


属性 和 事件 说 明 
Interval 该 属性 用 于 指定 间隔 时 间 ， 其 设置 值 的 单位 是 毫秒 ， 默 认 值 则 是 60000 毫秒 
Enabled 该 属性 用 于 表示 是 否 允 许 tick 事件 


Tick 该 事件 在 Interval 指定 的 间隔 到 期 后 触发 

需要 注意 的 是 ， 将 Timer 控件 的 Interval 属性 设置 为 较 小 的 值 会 使 得 回 送 频率 增加 ， 
也 很 容易 使 Web 服务 器 的 流量 大 增 , 对 整体 资源 耗 用 与 效率 都 会 造成 不 良 的 影响 。 因 此 应 
尽量 在 确实 需要 的 时 候 才 使 用 Timer 控件 来 定时 更 新 页 面 上 的 内 容 。 

Timer 控件 在 UpdatePanel 控件 的 内 外 是 有 区 别 的 。 当 Timer 控件 在 UpdatePanel 控件 
内 部 时 ，JavaScript 计时 组 件 只 有 在 一 次 回 传 完成 后 才 会 重新 建立 。 也 就 是 说 ， 直 到 网 页 回 
传 完成 之 前 ， 定 时 器 间隔 时 间 不 会 从 头 计算 。 例 如 ， 用 户 设 置 Timer 控件 的 Interval 属性 
值 为 3000ms(3 秒 )， 但 是 回 传 操作 本 身 却 花 了 2 秒 才 完成 ， 那 么 ， 下 一 次 的 回 传 将 发 生 在 
前 一 次 回 传 被 引发 之 后 的 5 秒 。 而 如 果 Timer 控件 位 于 UpdatePanel 控件 之 外 ， 当 定时 器 
间隔 到 期 以 后 ， 定 时 器 间隔 时 间 会 立刻 重新 计算 ， 下 一 次 回 传 将 发 生 在 前 一 次 回 传 被 引发 
之 后 的 3 秒 。 

2. 使 用 Timer 控件 定时 更 新 UpdatePanel 


Timer 控件 的 用 法 非常 简单 。 该 控件 按照 指定 的 时 间 间 隔 激活 其 Tick 事件 。 在 这 个 事 
件 处 理 程序 中 添加 要 刷新 页 面 的 代码 即 可 。 

例 8-6: 在 UpdatePanel 内 部 使 用 Timer 控件 。 实 现 图 片 的 自动 刷新 。 

(1) 启动 VWD 2010， 打 开 网 站 Chapter8 。 

(2) 通过 “添加 新 项 ”对 话 框 添加 一 个 名 为 TimerTest.aspx 的 页 面 。 

(3) 向 网 站 根 目 录 下 的 images 文件 夹 中 添加 需要 循环 显示 的 图 片 文件 Heartsl.gif、 
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Hearts2.gif***Hearts1l3.gif。 
(4) 切换 到 TimerTest.aspx 的 “设计 ”视图 , 添加 一 个 ScriptManager 和 一 个 UpdatePanel 
ZAE o 
(5) 在 UpdatePanel 控件 中 添加 一 个 Label 控件 、 一 个 Timer 控件 和 一 个 Image 控件 ， 
设置 Timer 控件 的 Interval 属性 为 3000, 设置 Image 控件 的 ImageUrl 属性 为 images 目录 下 
的 Hearts1.gif。 
(6) 对 应 “ 源 ” 视 图 中 生成 的 代码 如 下 : 
<h3> 使 用 Timer 控件 循环 显示 红 桃 1-K</h3> 
<asp:ScriptManager ID="ScriptManagerl" runat="server"> 
</asp:ScriptManager> 


<asp:UpdatePanel ID="UpdatePanell" runat="server"> 
<ContentTemplate> 


<asp:Timer ID="Timer1" runat="server" Interval="3000" 
ontick="Timer1_Tick"> 
</asp:Timer> 
<asp:Label ID="Label1" runat="server" Text=" 显 示 当 前 时 间 "></asp:Label> 
<asp:Image ID="Imagel" runat="server" ImageUrl="~/images/Hearts1.gif" /> 
</ContentTemplate> 
</asp:UpdatePanel> 


(7) 添加 Timer 控件 的 Tick 事件 处 理 程序 和 页 面 的 Load 事件 处 理 程序 ， 代 码 如 下 : 


protected void Page_Load(object sender, EventArgs e) 


{ 
if (!Page.IsPostBack ) 
{ 
ViewState["count"] = 1;// 设 置 网 页 上 的 变量 
} 
} 
protected void Timer1_Tick(object sender, EventArgs e) 
{ 


ViewState["count"] = (int)ViewState["count"] % 13 + 1; 
System. Threading. Thread.Sleep(2000);//4 í 2 秒 
Labell .Text = DateTime.Now.ToString(); 
JImagel.ImageUrl = string.Format("~/images/Hearts {0}.gif', ViewState["count"]); 
ji 
上 述 代码 中 使 用 到 了 已 经 学 习 过 的 视图 状态 来 存放 一 个 计数 变量 。 
(8) 编译 并 运行 程序 ， 由 于 Timer 控件 在 UpdatePanel 控件 内 部 ，Interval 属性 为 3 秒 ， 
程序 内 部 等 待 2 秒 , 所 以 看 到 的 结果 是 每 5 秒 自动 刷新 一 次 时 间 , 同时 显示 下 一 张 扑 克 牌 ， 
循环 显示 红 桃 1-K， 如 图 8-11 所 示 。 
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E mttp://1ocalhost:1082/Chapter8/Tine... - ËJ | nttp://localhost:1082/Chapter8/Tiwe...|- [DEI 
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使 用 Timer 控 件 循环 显示 红 桃 1-K 使 用 Timer 控 件 循环 显示 红 桃 1-K 
vv Bey 
vv vy 
a 的 
2012-7-26 20:54:27 全 a5 2012-7-26 20:54:32 * é: 
Internet 本- x ~ @ muat far Rios ~ 


图 8-11 使 用 Timer 控件 定时 刷新 页 面 


3. 定时 更 新 多 个 UpdatePanel 


使 用 Timer 控件 定时 更 新 多 个 UpdatePanel 控件 ， 可 以 使 用 一 个 Timer 控件 ， 也 可 以 
使 用 多 个 Timer 控件 。 
例 8-7: 使 用 两 个 Timer 控件 定时 更 新 两 个 UpdatePanel 控件 ，Timer 控件 均 被 放 在 
UpdatePanel 控件 的 外 面 ， 并 将 Timer 控件 配置 为 UpdatePanel 控件 的 触发 器 。 
(1) 启动 VWD 2010， 打 开 网 站 Chapter8。 
(2) 通过 “添加 新 项 ”对 话 框 添加 一 个 名 为 TimerTest2.aspx 的 页 面 。 
(3) 切换 到 TimerTest.aspx 的 “设计 ”视图 , 添加 一 个 ScriptManager 和 两 个 UpdatePanel 
控件 。 在 两 个 UpdatePanel 控件 中 各 添加 一 个 Label 控件 ， 用 于 显示 当前 时 间 。 
(4) 在 两 个 UpdatePanel 控件 之 外 ,添加 两 个 Timer 控件 ， 设 置 Timerl 的 Interval 属性 
为 2000， 即 每 隔 2 秒 更 新 一 次 ， 设 置 Timer2 的 Interval 属性 为 “3000”， 即 每 隔 3 秒 更 新 
-次 。 
(5) 选中 UpdatePanell 控件 ， 通 过 “属性 ”面板 设置 其 Triggers 属性 ， 在 打开 的 
“UpdatePanelTrigger 集合 编辑 器 ”对 话 框 中 添加 一 个 AsyncPostBackTrigger， 设 置 
ControlID 为 Timerl, EventName 为 Tick。 
(6) 同样 地 ， 设 置 UpdatePanel2 的 AsyncPostBackTigger 为 Timer2 。 
(7) 对 应 “ 源 ” 视 图 中 生成 的 代码 如 下 : 


<div> 
<asp:ScriptManager ID="ScriptManagerl" runat="server"> 
</asp:ScriptManager> 
<asp:UpdatePanel ID="UpdatePanell" runat="server"> 
<ContentTemplate> 
<asp:Label ID="Labell" runat="server" Text="Label"></asp:Label> 
</ContentTemplate> 
<Triggers> 
<asp:AsyncPostBackTrigger ControllD="Timer1" EventName="Tick" /> 
</Triggers> 
</asp:UpdatePanel> 


<asp:UpdatePanel ID="UpdatePanel2" runat="server"> 
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<ContentTemplate> 
<asp:Label ID="Label2" runat="server" Text="Label"></asp:Label> 
</ContentTemplate> 
<Triggers> 
<asp:AsyncPostBackTrigger ControllD="Timer2" EventName="Tick" /> 
</Triggers> 
</asp:UpdatePanel> 
<asp:Timer ID="Timer1" runat="server" Interval="2000" ontick="Timer1_Tick"> 
</asp:Timer> 
<asp:Timer ID="Timer2" runat="server" Interval="3000" ontick="Timer2_Tick"> 
</asp:Timer> 
</div> 


(8) 添加 Timer 控件 的 Tick 事件 处 理 程序 ， 代 码 如 下 : 


protected void Timer1_Tick(object sender, EventArgs e) 


{ 

Labell.Text = "UpdatePanell 更 新 于 : "+ DateTime.Now.ToString(); 
protected void Timer2_Tick(object sender, EventArgs e) 
{ 

Label2.Text = "UpdatePanel2 更 新 于 : "+ DateTime Now.ToString0; 
} 


(9) 编译 并 运行 程序 ， 可 以 看 到 ，UpdatePanell 控件 每 3 秒 更 新 一 次 ，UpdatePanel2 
控件 每 2 秒 更 新 一 次 ， 如 图 8-12 所 示 。 


(éwstp://1ocalhost: 1082/ChapterB/Tiwe... -OE 


x 
g Ə e localhost w] 
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UpdatePanell 更 新 于 ， 2012-7-26 21:20:07 
UpdatePanel2 更 新 于 ， 2012-7-26 21:20:06 


@ Internet fa- Rios > 


图 8-12 ”定时 刷新 2 个 UpdatePanel 控件 


8.25 ScriptManagerProxy 控件 


ScriptManagerProxy 控件 是 内 容 页 面 与 母 版 页 中 定义 的 ScriptManager 控件 之 间 的 桥 
梁 。 在 页 面 中 ，ScriptManagerProxy 控件 的 外 观 和 操作 与 标准 控件 ScriptManager 很 相似 。 
但 是 ,ScriptManagerProxy 控件 实际 上 只 是 一 个 proxy 类 ， 且 该 类 可 以 将 其 所 有 的 设置 传递 
给 母 版 页 中 真正 的 ScriptManager 控件 。 

本 书 第 9 章 将 介绍 Web 服务 的 时 候 会 用 到 该 控件 ， 此 处 不 过 多 介绍 。 
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8.3 ”客户 端 ASP.NET AJAX Library 


客户 端 ASP.NET AJAX Library 的 功能 非常 强大 ， 并 且 能 够 提供 浏览 器 中 纯 JavaScript 
所 缺少 的 许多 功能 。Microsoft 从 .NET Framework 中 吸取 了 许多 好 的 功能 ， 然 后 将 它们 转 
换 为 客户 端 JavaScript 对 应 的 功能 。 这 就 意味 着 可 以 在 支持 JavaScript 的 Web 站 点 中 使 用 
熟悉 的 .NET 概念 ， 即 使 JavaScript 不 支持 这 些 概念 。 

客户 端 库 包 括 6 个 顶级 的 命名 空间 (包括 根 命名 空间 Sys) 和 1 个 全 局 命名 空间 , 它们 多 
许 访问 30 多 个 类 , 而 这 些 类 有 具 有数 百 种 有 用 的 方法 ,可 用 来 帮助 创建 富 客 户 端 Web 界面 。 

例如 ， 可 以 使 用 客户 端 框架 建立 和 处 理 页 面 事件 (如 load 和 unload)， 使 用 WebRequest 
类 对 其 他 的 Web 页 面 发 出 请 求 , 根据 不 同 的 客户 端 设置 来 呈现 不 同 格式 的 数据 ,执行 数据 
绑 定 ( 绑 定 的 数据 源 有 多 种 ， 如 可 以 将 Web 服务 绑 定 到 用 户 的 界面 控件 中 ， 从 而 显示 并 编 
辑 它 们 ) 以 及 其 他 情况 。 

全 局 命名 空间 中 包含 了 一 些 成 员 和 类 型 ， 它 们 扩展 了 JavaScript 原先 设计 的 特性 。 还 
包含 了 在 JavaScript 中 发 现 的 类 型 , 如 Array, Boolean, Error 、Number、 Object 和 String, 
这 些 类 型 已 经 被 扩展 为 包含 模仿 .NET Framework 的 行为 。 如 表 8-5 所 示 列 出 了 这 些 类 型 的 


表 8-5_ 全 局 命名 空间 中 的 成 员 和 类 型 的 常用 方法 
用 R 
使 用 指定 的 格式 字符 串 和 参数 返回 一 个 格式 化 的 字符 串 ， 例 如 : 
var str = String.format('Hello {0}', name); 
用 于 确定 一 个 字符 串 是 否 以 另 一 个 字符 串 作 为 开始 或 结束 , 例如 : 


String var isGemm = 'Ge Mengmeng'.startsWith('Ge'); 


删除 字符 串 前 面 和 后 面 的 空格 ， 例 如 : 
var trimmed = ' Zhao Yanduo '.trimO:// results is Zhao Yanduo 


将 保留 包含 有 文本 true or 或 false 的 字符 串 转 换 成 真正 的 布尔 值 。 
出 现 其 他 值 时 则 抛 出 一 个 异常 ， 例 如 : 

var isTrue = Boolean parse('true'); 

可 以 获得 日 期 的 不 同 的 格式 化 字符 串 表 示 ， 例 如 : 

alert(new Date().format('f')); 


Boolean 


Date 


客户 端 ASP.NET AJAX Library 很 大 ， 所 以 并 不 是 总 能 很 容易 地 找到 需要 的 方法 、 类 
或 命名 空间 。 为 了 更 有 效 地 使 用 客户 端 库 ， 可 以 使 用 一 些 很 好 的 资源 。 而 首选 就 是 VWD 
提供 的 “智能 提示 ”， 它 可 以 在 不 同 的 类 型 中 提供 可 用 成 员 。 

例如 ， 如 图 8-13 所 示 ，VWD 推测 变量 name 的 类 型 是 字符 串 ， 这 是 因为 该 变量 提供 
了 与 字符 串 相关 的 方法 ， 如 substring 和 trim， 这 两 个 方法 已 经 被 客户 端 库 添 加 到 String 类 
型 中 了 。 如 果 指定 一 个 数字 给 变量 , 就 会 得 到 一 个 与 数字 类 型 对 应 的 列表 , 如 图 8-14 所 示 。 
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“Q hasOrnFroperty 
Ç isPrototype0f 


$ localeFormat 
$ propertyIsEnumerable 
È toExponential 

È toFixed 

È teLocaleString 


图 8-13 智能 提示 推测 变量 为 字符 串 图 8-14 ”数字 类 型 变量 对 应 的 方法 列表 


许多 成 员 已 经 被 文档 化 ， 因 此 可 以 得 到 一 个 很 好 的 提示 文本 来 说 明 如 何 使 用 这 些 成 
员 。 如 果 没 有 看 到 正确 的 方法 出 现 ， 则 可 能 是 页 面 (或 母 版 页 ) 中 没有 ScriptManager 控件 。 
而 没有 该 控件 ， 客 户 端 JavaScript 框架 将 无 法 使 用 ， 因 此 VWD 就 会 禁止 使 用 浏览 器 的 最 
终 页 面 中 不 可 用 的 功能 。 有 时 “智能 提示 ”很 可 能 没有 在 列表 中 显示 所 期 望 的 成 员 ， 但 是 
这 并 不 能 说 明 这 些 方法 不 可 用 。 因 为 JavaScript 不 是 一 种 强 类 型 的 语言 ， 所 以 VWD 需要 
做 许多 的 解析 、 推 断 和 猜测 工作 来 提供 正确 的 选项 。 

例 8-8: 客户 端 ASPNET AJAX Library 的 一 个 简单 应 用 。 

(1) 启动 VWD 2010， 打 开 网 站 Chapter8。 

(2) 通过 “添加 新 项 ”对 话 框 添加 一 个 名 为 AjaxLibrary.aspx 的 页 面 。 

(3) 切换 到 AjaxLibrary.aspx 的 “设计 ”视图 ， 添 加 一 个 ScriptManager 控件 。 

(4) 在 <ScriptManager> 的 结束 标记 下 方 ， 添 加 一 个 mput (Text) 和 一 个 Input (Button) 控 
件 ， 方 法 是 从 工具 箱 的 HTML 类 别 中 拖 动 它们 。 通 过 使 用 纯 HTML 元 素 而 不 是 ASP.NET 
服务 器 控件 ， 可 以 看 到 要 写 的 代码 在 客户 端 执行 。 将 按钮 的 value 设置 为 “提交 ”。 相 应 
的 代码 如 下 : 


<asp:ScriptManager ID="ScriptManagerl" runat="server"> 
</asp:ScriptManager> 

姓名 : <input id="TextName" type="text" /> 

<input id="Button1" type="button" value=" 提 交 " /> 


(5) 在 这 两 个 HTML 控件 的 下 面 ， 添 加 如 下 客户 端 JavaScript 代码 块 : 


<script type="text/javascript"> 
$addHandler($get('Button1'), 'click', Hello); 
function Hello() { 
var name = $get('TextName').value; 
if (name.length = 0) 
alert(" 请 输入 姓名 "); 
else 
alert("Hello " + name); 
} 
</script> 


其 中 ，$addHandler 是 Ajax 框架 中 定义 的 Sys.ULDomEvent 类 的 addHandler 方法 的 一 
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个 快捷 方式 。 可 以 用 它 在 页 面 中 注册 这 些 对 象 特定 事件 的 事件 处 理 程序 。 这 与 在 C# 服 务 器 
端 代码 中 看 到 的 事件 处 理 程序 类 似 。S$get 用 来 获得 对 HTML 标记 的 引用 。 


技巧 : 
$get 和 $addHandler 最 大 的 好 处 是 可 以 在 任何 站 点 中 使 用 它们 。 所 需 做 的 就 是 在 母 版 页 
或 内 容 页 内 包含 ScriptManager 控件 ， 并 准备 使 用 客户 端 框架 。 


(6) 编译 并 运行 程序 ， 在 文本 框 中 输入 一 个 名 字 ， 单 击 “ 提 交 ” 按 钮 ， 将 弹出 相应 的 
欢迎 对 话 框 ， 如 图 8-15 所 示 。 


一 | 
Øhttp://10ca1] hap x -JDE 
go- 四 Localhost ED [CE 
ABER Æ http://localhost: 10. | A BUT 
Ha: BRA EEEa] 
CE 
O r a. Rios ~ 


图 8-15 客户 端 AJAX Library 应 用 示例 


说 明 : 

ASP.NET AJAX 包含 的 内 容 还 有 很 多 ， 无 法 在 此 都 一 一 介绍 。ASPNET AJAX 的 服务 
器 和 客户 机 端 部 分 可 能 是 最 大 的 、 使 用 最 多 的 功能 ， 其 他 的 功能 也 都 是 比较 实用 的 ， 例 如 ， 
ASPNET AJAX 控件 工具 箱 ， 它 是 一 个 非常 好 的 扩展 控件 工具 包 ， 带 有 诸如 日 历 扩 展 器 和 
能 自动 完成 的 文本 框 这 样 的 功能 。 包 括 四 十 多 个 免费 的 扩展 控件 ， 而 且 一 直 都 在 增加 ， 可 
以 在 网 站 http://www.asp.net/ajax/AjaxControlToolkit/Samples 上 查看 和 下 载 控件 工具 箱 。 


8.4 本 章 小 结 


Ajax 应 用 广泛 ， 可 以 给 站 点 增加 许多 功能 。 它 可 以 分 为 两 个 不 同 的 部 分 ， 服 务 器 端 控 
件 和 客户 端 JavaScript Framework。 要 使 用 Ajax 功能 增强 Web 站 点 ， 可 以 选择 不 同 的 Ajax 
架构 。Microsoft ASP.NET AJAX 除了 提供 实现 无 闪烁 页 面 的 控件 之 外 ， 还 提供 了 更 多 的 服 
务 器 控件 来 创建 富 交互 式 的 且 有 响应 的 用 户 界面 。 本 章 重 点 介绍 了 ASP.NET AJAX 控件 的 
具体 用 法 ， 以 及 客户 端 AJAX Library。 通 过 本 章 的 学 习 ， 读 者 应 掌握 快速 创建 无 闪烁 页 面 
的 方法 。 


85 思考 和 练习 


1. 工具 箱 中 的 AJAX Extensions 类 别 中 的 ScriptManager 和 ScriptManagerProxy 控件 有 
何 区 别 ? 
2. UpdatePanel 控件 有 什么 作用 ? 如何 让 UpdatePanel 控件 外 部 的 按钮 进行 异步 刷新 ? 
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- 如 何 让 用 户 知道 部 分 页 面 更 新 正在 进行 ? 
. UpdateProgress 控件 的 AssociatedUpdatePanelID 属性 有 什么 用 ? 


. $addHandler 有 什么 作用 ? 


上 机 操作 。 

新 建 一 个 网 站 ， 在 Default.aspx 页 面 中 的 左上 角 显 示 当前 的 时 间 ， 要 求 采用 局 部 刷 
添加 一 个 网 页 ，, 实现 相册 功能 , 通过 “上 一 个 ”和 “下 一 个 ”按钮 ， 局 部 刷新 Image 
控件 ， 显 示 不 同 的 图 片 。 


第 9 章 ”Web 服务 


Web 服务 使 得 Internet 成 为 一 个 可 以 无 限 扩展 、 拥 有 无 限 潜力 的 分 布 式 计算 平台 。 任 
何 设备 可 以 随时 随地 访问 Internet 上 的 Web 服务 。Web 服务 具有 基于 组 件 的 开发 和 Web 
开发 两 者 的 优点 。 本 章 将 介绍 ASPNET Web 服务 体系 ， 使 用 VWD 创建 和 调用 Web 服务 
的 机 制 ， 以 及 在 AJAX 站 点 中 使 用 Web 服务 和 Web 方法 。 

本 章 学 习 目 标 : 

© Web 服务 的 工作 原理 
创建 Web 服务 
调用 Web 服务 
支持 AJAX 的 Web 服务 
在 AJAX 站 点 中 调用 页 面 方法 
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Web 服务 葛 定 了 下 一 代 Web 应 用 程序 的 基础 。 无 论 客户 应 用 程序 是 Windows 应 用 程 
序 ， 还 是 ASPNET Web 应 用 程序 ， 无 论 客户 程序 运行 在 Windows. Pocket Windows 或 其 
他 操作 系统 上 ， 它 们 都 可 以 通过 Internet 使 用 Web 服务 定期 通信 。Web 服务 是 服务 器 端的 
程序 ， 用 来 监听 来 自 客户 应 用 程序 的 消息 ， 并 返回 特定 的 信息 。 这 些 信 息 可 能 来 自 Web 
服务 本 身 ， 也 可 能 是 同一 个 域 中 的 其 他 组 件 ， 或 其 他 Web 服务 。 


9.1.1 Web 服务 概述 


简单 地 讲 ，Web 服务 是 一 个 基于 因特网 的 可 通过 Web 被 远程 调用 的 应 用 程序 模块 
(APD， 例 如 网 站 中 如 果 想 提供 天 气 预报 的 服务 ， 不 用 自己 实现 天 气 预 报 的 功能 ， 只 需 调 用 
其 他 公司 提供 的 免费 或 付费 Web 服务 即 可 。 
e 服务 就 是 一 个 软件 , 它 和 客户 端 应 用 程序 没有 很 紧密 地 耦合 或 关联 。 服 务 是 可 以 被 
动态 地 发 现 及 组 合成 其 他 软件 的 软件 实体 。 
© Web 服务 是 一 种 基于 XML, JSON, SOAP, HTTP, UDDI 和 WSDL 等 一 系列 标 
准 实现 的 分 布 式 计算 技术 和 软件 组 件 。 
e Web 服务 提供 了 一 个 松 耦 合 和 跨 平 台 的 分 布 式 计 算 环 境 ， 它 是 一 个 与 操作 系统 、 
程序 设计 语言 、 机 器 类 型 以 及 运行 环境 都 无 关 的 平台 , 能 够 实现 网 络 上 应 用 的 共享 ， 
并 可 用 于 复杂 的 系统 集成 。 
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微软 为 Web 服务 下 的 定义 是 通过 标准 的 Web 协议 可 编程 访问 的 Web 组件。 每 个 Web 
服务 的 实现 是 完全 独立 的 。Web 服务 具有 基于 组 件 的 开发 和 Web 开发 两 者 的 优点 ， 是 
Microsoft 的 .NET 程序 设计 模式 的 核心 。 
国际 标准 化 组 织 W3C 为 Web 服务 下 的 定义 是 一 个 通过 URL 识别 的 软件 应 用 程序 ,其 
界面 及 绑 定 能 用 XML 文档 来 定义 、 描 述 和 发 现 ， 使 用 基于 Internet 协议 上 的 消息 传递 方 
式 与 其 他 应 用 程序 进行 直接 交互 。 

1. Web 服务 的 影响 


(1) Web 服务 支持 在 Web 站 点 上 放置 可 编程 的 元 素 ， 用 户 可 以 抓 取 已 有 的 元 素 ， 构 成 
自己 的 新 服务 。 

(2) 能 进行 基于 Web 的 分 布 式 计算 和 处 理 ， 能 很 好 地 兼容 现 有 的 Web 技术 。 

(3) Web 服务 使 得 Internet 成 为 一 个 可 以 无 限 扩 展 、 拥 有 无 限 潜力 的 分 布 式 计算 平台 。 

(4) 任何 设备 都 可 以 随时 随地 访问 Internet 上 的 Web 服务 。 

(5) 软件 模块 充分 复 用 、 计 算 机 资源 充分 共享 、 信 息 无 颖 共享 和 交流 。 

(6) 利用 Web 服务 ， 公 司 和 个 人 将 能 够 迅速 且 廉 价 地 向 整个 国际 互联 网 提供 他 们 的 服 
务 ， 进 而 建立 全 球 范 围 的 联系 ， 在 广泛 的 范围 内 寻找 可 能 的 合作 伙伴 。 

2. Web 服务 的 主要 特征 


(1) 互 操作 性 : 一 个 Web 服务 可 以 与 其 他 Web 服务 交互 ， 协 同 工 作 ; 可 以 使 用 任何 语 
言 开发 Web 服务 或 使 用 他 人 提供 的 Web 服务 ， 开 发 环境 可 以 异 构 。 

(2) 普遍 性 :Web 服务 使 用 HTTP 和 XML 进行 通信 ， 支 持 这 些 技术 的 设备 都 可 以 拥 
有 和 访问 Web 服务 。 

(3) 松散 耦合 ， Web 服务 的 实现 对 使 用 者 透明 ， 当 服务 的 实现 发 生变 动 时 不 影响 用 户 
使 用 。 

(4) 高 度 可 集成 能 力 : Web 服务 和 采用 了 简单 的 、 易 理解 的 标准 Web 协议 作为 组 件 界 
面 描述 和 协同 描述 规范 ， 屏 蔽 了 平台 的 异 构 性 ，CORBA、DCOM 和 EJB 等 都 可 通过 它 进 
行 互 操作 。 


9.1.2 ASPNET Web 服务 体系 


NET 平台 和 ASP.NET 在 创建 和 使 用 Web 服务 方面 提供 了 广泛 的 支持 。 这 些 技术 赋予 
户 一 个 优秀 的 、 简 单 易 用 的 平台 ， 从 而 可 以 快速 有 效 地 创建 和 使 用 Web 服务 。 如 图 9-1 
所 示 是 ASPNET Web 服务 的 体系 结构 。 

ASP.NET Web 服务 体系 包括 客户 端 应 用 程序 `、 ASP.NET Web 服务 程序 以 及 一 些 文件 ， 
如 : 代码 文件 、.asmx 文件 和 编译 后 的 .dll 文件。 还 包括 一 台 Web 服务 器 来 存 载 Web 服务 
程序 和 客户 端 。 如 果 需 要 ， 还 可 以 有 一 台数 据 库 服 务 器 来 存 取 Web 服务 中 的 数据 。 

XML 或 JSON 是 数据 的 格式 ，SOAP 是 调用 Web 服务 的 协议 ，WSDL 是 描述 Web Jik 
务 的 格式 ， 而 UDDI 是 Web 服务 发 布 、 查 找 和 利用 的 组 合 。 
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e SOAP(Simple Object Access Protocol): SOAP 是 一 套用 于 Web 服务 端 和 客户 端 通信 
的 标准 消息 控制 协议 ， 要 调用 Web 服务 上 的 一 个 方法 ， 该 调用 必须 转换 为 SOAP 
消息 ， 因 为 它 是 在 WSDL 文档 中 定义 的 。 如 图 9-2 所 示 是 SOAP 消息 的 一 部 分 。 
SOAP 封装 (envelop) 把 所 有 的 SOAP 消息 封装 在 一 个 块 中 。SOAP 封装 本 身 由 两 部 
分 组 成 : SOAP 标题 和 SOAP 体 。 标 题 是 可 选 的 ， 它 定义 了 客户 机 和 服务 器 应 如 何 
处 理 SOAP 体 。SOAP 体 是 必须 有 的 ， 它 包括 发 送 的 数据 ， 通 常 SOAP 体 中 的 信息 
是 要 调用 的 方法 和 序列 化 的 参数 值 .SOAP 服务 器 在 SOAP 消息 的 消息 体 中 返回 值 。 


We 服务 里 ADONETRRE 


图 9-1 ASP.NET Web 服务 体系 图 9-2 SOAP 消息 


e WSDL(Web Services Description Language): WSDL 是 Web 服务 描述 语言 。 可 以 认 
为 WSDL 文 件 是 一 个 XML 文档 ,用 于 说 明 一 组 SOAP 消息 以 及 如 何 交换 这 些 消息 。 
换 句 话说, WSDL 对 于 SOAP 的 作用 就 像 IDL 对 于 CORBA 或 COM 的 作用 。 通常 
WSDL 文档 是 由 软件 生成 和 使 用 的 。 

e UDDI(Universal Description Discovery and Integration): UDDI 是 Web 服务 的 黄页 。 
与 传统 黄页 一 样 ， 用户 可 以 搜索 提供 所 需 服务 的 公司 阅读 了 解 所 提供 的 服务 ， 然 
后 与 某 人 联系 以 获得 更 多 信息 。 当 然 用 户 也 可 以 提供 Web 服务 而 不 在 UDDI 中 注 
册 ， 就 像 在 地 下 室 开 展业 务 ， 依 靠 的 是 口头 吃喝 ; 但 是 如 果 希 望 拓展 市 场 ， 则 需要 
UDDI 以 便 能 被 客户 发 现 。 


9.1.3 支持 AJAX 的 Web 服务 


ASP.NET AJAX 提供 了 完整 的 架构 以 从 客户 端 JavaScript 调用 ASP.NET Web 服务 。 设 
计 者 可 以 轻松 地 用 AJAX 把 服务 器 端的 数据 和 功能 集成 到 用 户 响 应 的 Web 页 面 中 , 而 所 需 
要 做 的 就 是 用 ScriptService 属性 来 标识 Web 服务 。ASP.NET AJAX 框架 会 为 Web 服务 自 
动 生成 JavaScript 代理 ， 然 后 通过 使 用 代理 来 调用 Web 方法 。 

JSON(JavaScript Object Notation) 是 一 种 轻 量 级 的 数据 交换 格式 ， 易 于 阅读 和 编写 ， 并 
且 易 于 机 器 解析 和 生成 。JSON 采用 完全 独立 于 语言 的 文本 格式 ， 使 用 了 类 似 于 C 语言 家 
族 的 习惯 。 这 些 特性 使 JSON 成 为 理想 的 数据 交换 语言 。 

JSON 建构 于 以 下 两 种 结构 。 

(1) “名 称 / 值 ”对 的 集合 。 不 同 的 语言 中 ， 它 被 理解 为 对 象 (object)、 记 录 (record)、 结 
构 (struct)、 字 典 (dictionary)、 哈 希 表 (hash table)、 有 和 键 列表 (keyed list)， 或 者 关联 数组 
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(associative array); 

(2) 值 的 有 序列 表 。 在 大 部 分 语言 中 ， 它 被 理解 为 数组 (array)。 

这 些 都 是 常见 的 数据 结构 。 事 实 上 大 部 分 现代 计算 机 语言 都 以 某 种 形式 支持 它们 。 这 
使 得 一 种 数据 格式 在 同样 基于 这 些 结构 的 编程 语言 之 间 交 换 成 为 可 能 。 

JSON 以 一 种 特定 的 字符 串 形式 来 表示 JavaScript 对 象 。 如 果 将 具有 这 样 一 种 形式 的 字 
符 串 赋 给 任意 一 个 JavaScript 变量 ， 那 么 该 变量 会 变 成 一 个 对 象 引 用 ， 而 这 个 对 象 就 是 字 
符 串 所 构建 出 来 的 。 

例如 ， 假 设 需要 创建 一 个 User 对 象 ， 并 具有 用 户 ID、 用 户 名 和 用 户 Email 这 3 个 属 
性 ， 可 以 使 用 以 下 JSON 形式 来 表示 User XJ: 


{"UserID":110, "Name":" 赵 艳 铎 ". "Email":gemm@gmail.com"}; 


如 果 把 这 一 字符 串 赋予 一 个 JavaScript 变量 ， 那 么 就 可 以 直接 使 用 对 象 的 任 一 属性 了 。 
完整 代码 如 下 : 


<script>var User = ("UserID":110, "Name":" 赵 艳 铎 ", "Email":":gemm@gmail.com"}; 
alert(User.Name); </script> 


借助 ASP.NET AJAX Extension， 微 软 选 择 JSON 在 服务 器 和 Ajax 客户 端 实现 数据 交 
换 ， 从 而 创建 支持 AJAX 的 Web 服务 。 在 客户 端 和 服务 器 端 都 实现 了 数据 的 串 行 化 器 和 并 
行 化 器 以 使 数据 按 JSON 的 格式 交换 。 网 页 中 的 客户 端 脚本 与 服务 器 通过 Web 服务 通信 层 
进行 通信 来 访问 Web 服务 ， 该 通信 层 使 用 AJAX 技术 进行 Web 服务 调用 ， 数 据 在 客户 端 
与 服务 器 之 间 通 常 采用 JSON 格式 进行 异步 交换 。 


说 明 : 

默认 将 JavaScript 对 象 序列 化 为 JSON 格式 , 使 用 JavaScript 的 eval 函数 可 以 进行 反 序 
列 化 操作 。 但 Web 服务 和 ASPNET 网 页 中 的 单个 方法 可 以 返回 其 他 格式 。 可 以 通过 
ScriptMethod 属性 来 指定 方法 的 序列 化 格式 .对 于 某 个 ASMX 服务 , 可 以 设置 ScriptMethod 
属性 形 如 [ScriptMethod(ResponseFormat = ResponseFormat Xml)] 以 使 某 个 Web 服务 方法 返 
回 XML 数据 。 
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在 .NET Framework 中 ， 可 以 很 容易 地 创建 和 使 用 Web 服务 。 与 Web 服务 相关 的 命名 
空间 一 共有 3 个 。 

© System.Web.Services: 该 命名 空间 中 的 类 用 于 创建 Web 服务 。 

@ System.Web.Services.Description: 使 用 该 命名 空间 可 以 通过 WSDL 描述 Web 服务 。 

© System.Web.Services.Protocols: 使 用 该 命名 空间 可 以 创建 SOAP 请 求 和 响应 。 
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9.2.1 WebService 类 


要 创建 Web 服务 ， 可 以 从 System. Web.Services.WebService 中 派生 Web 服务 类 。 
WebService 类 提供 了 对 ASP.NET Application 和 Session 对 象 的 访问 。 WebService 类 的 常用 
属性 如 表 9-1 所 示 。 


表 9-1 WebService 类 的 常用 属性 


属 性 说 有明 
Application 为 当前 请 求 返 回 一 个 HttpApplicationState 对 象 
Context 返回 一 个 封装 HTTP 特定 信息 的 HttpContext 对 象 。 可 以 从 中 读 取 HTTP 标题 信息 
Server 返回 一 个 HttpServerUftility 对 象 。 这 个 类 有 一 些 方法 ， 可 以 进行 URL 编码 和 解码 
Session 返回 一 个 HttpSessionState 对 象 ， 以 存储 客户 端的 一 些 状态 
人 返回 一 个 实现 IPrincipal 接口 的 用 户 对 象 。 使 用 这 个 接口 可 以 得 到 用 户 名 和 身份 验 


证 类 型 
返回 Web 服务 使 用 的 SOAP 版 本 。SOAP 版 本 封装 在 SoapProtocolVersion 枚 举 中 


SoapVersion 


1. WebService 属性 

与 普通 的 类 继承 不 同 的 是 ，WebService 的 子 类 需要 用 WebService 属性 来 标记 ， 该 属 
性 用 于 向 XML Web 服务 添加 附加 信息 ， 如 描述 其 功能 的 字符 串 。 这 是 一 个 
WebServiceAttribute 类 的 对 象 ， 共 有 3 个 可 选 属性 ， 如 表 9-2 所 示 。 


表 9-2 WebServiceAttribute 类 的 属性 


服务 的 描述 信息 ， 可 用 于 WSDL 文档 
获取 或 设置 Web 服务 名 称 
获取 或 设置 Web 服务 的 XML 命名 空间 。 其 默认 值 为 http://tempuri.org， 用 于 测试 ， 
但 在 开发 这 个 服务 前 ， 应 修改 该 命名 空间 
2. WebServiceBinding 属性 


Description 


Name 


Namespace 


.NET 2.0 给 Web 服务 添加 了 一 个 新 届 性 WebServiceBinding。 这 个 属性 用 于 把 Web 服 
务 标记 为 可 交互 操作 的 一 致 性 级 别 。 如 表 9-3 所 示 列 出 了 WebServiceBindingAttribute 类 的 
一 些 属性 。 


表 9-3 WebServiceBindingAttribute 类 的 常用 属性 


E 性 说 BB 
Web 服务 的 一 致 性 级 别 可 设置 为 WsiClaims 枚 举 的 一 个 值 。WsiClaims 有 两 个 值 ， 
ConformanceClaims | Web 服务 遵循 Basic Profile 1.0 时 ， 其 值 为 BP10; 没有 定义 任何 一 致 性 级 别 时 ， 


其 值 为 None 
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K) 
E 性 说 明 
. . EmitConformanceClaims 是 一 个 布尔 属性 ， 定 义 了 用 ConformanceClaims 属性 
EmitConformanceClaims 
指定 的 一 致 性 级 别 是 否 应 传送 给 生成 的 WSDL 文档 
i 使 用 Name 属性 可 以 定义 绑 定 的 名 称 。 该 名 称 默 认 与 Web 服务 相同 ， 但 要 加 
ame 
上 Soap 字符 串 
. Location 属性 定义 了 绑 定 消息 的 位 置 ， 例 如 
Location 
http://www.timeout.com/Webservice.asmx?wsdl 
Namespace Namespace 属性 定义 了 绑 定 的 XML 命名 空间 


3. WebMethod 属性 

Web 服务 中 可 以 使 用 的 所 有 方法 都 必须 用 WebMethod 属性 来 标记 。 当 然 ， 也 可 以 有 
其 他 没有 用 WebMethod 标记 的 方法 ， 但 这 些 方法 只 能 在 WebMethod 中 调用 ， 而 不 能 在 客 
户 机 上 调用 。 使 用 属性 类 WebMethodAttribute， 就 可 以 在 远程 客户 机 上 调用 方法 ， 并 可 以 


4. ScriptService 


定义 是 否 缓存 响应 ， 缓 存 时 间 有 多 长 以 及 会 话 状 态 是 否 与 指定 的 参数 一 起 存储 等 。 
WebMethodAttribute 类 的 属性 如 表 9-4 所 示 。 
表 9-4 _ WebMethodAttribute 类 的 属性 
属 性 说 MA 
获取 或 设置 响应 是 否 应 缓存 的 标志 。 默 认 值 为 rue。 使 用 被 缓存 的 响应 ， 仅 可 以 
BufferResponse . h: 
将 已 完成 的 软件 包 传递 给 客户 机 
使 用 这 个 属性 可 以 设置 结果 应 缓存 的 时 间 长 短 。 如 果 在 这 个 属性 设置 的 时 间 段 中 
CacheDuration _ D POPES ey 
第 二 次 发 出 了 相同 的 i 就 返回 缓存 的 值 。 默 认 值 为 0， 这 表示 结果 不 缓存 
Description 该 描述 用 于 给 预期 的 用 户 生 成 服务 帮助 页 面 
布尔 值 ， 表 示 会 话 状态 是 否 有 效 。 默 认 值 是 false， 因 此 WebService 类 的 Session 
EnableSession _ 
属性 不 能 用 于 存储 会 话 状态 
MessageName 默认 状态 下 ， 把 消息 名 设置 为 方法 名 
TransactionOption 这 个 属性 表示 方法 的 事务 处 理 支 持 。 默 认 值 是 Disabled 


属性 


System. Web.Script.Services.ScriptService 属性 用 于 使 用 ASP.NET AJAX 从 脚本 中 调用 
Web 服务 。ScriptService 属性 的 主要 参数 如 表 9-5 所 示 。 


表 9-5 ScriptService 类 的 属性 


E 性 说 — BB 
指定 是 否 将 响应 序列 化 为 JSON 或 者 XML。 默认 为 SON， 但 是 ， 当 方法 的 返 
ResponseFormat N 
回 值 是 XmlDocument 时 ，XML 格式 会 比较 方便 
表明 是 否 可 以 使 用 HITP GET 调用 Web 服务 方法 。 由 于 安全 性 原因 ， 此 项 的 
UseHttpGet 
默认 设置 为 false 
TEE 表明 包括 字符 串 在 内 的 所 有 返回 类 型 是 否 都 序列 化 为 XML， 默 认为 false， 当 
XmlSerializeString 


响应 格式 设置 为 JSON 时 ， 将 忽略 该 属性 的 值 
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922 创建 Web 服务 


使 用 VWD 创建 Web 服务 非常 简单 , 只 需 选择 相应 的 模板 , 然后 按 向 导 提 示 操 作 即 可 。 

与 其 他 所 有 文档 类 型 一 样 ，VWD 也 附带 有 Web 服务 模板 。 可 以 使 用 “添加 新 项 ”对 
话 框 来 添加 Web 服务 。 之 后 可 以 修改 服务 ， 并 在 Web 浏览 器 中 使 用 ASP.NET 运行 库 自 动 
创建 的 标准 测试 页 面 测 试 它 。 当 Web 服务 正确 运行 时 ， 就 可 以 调用 该 服务 。 

下 面 我 们 创建 一 个 简单 的 Web 服务 ， 该 Web 服务 提供 了 两 个 方法 调用 : ”HelloWord 
和 AuthCode。 其 中 HelloWorld 是 默认 的 ， 而 AuthCode 用 于 返回 一 个 验证 码 图 片 的 二 进 制 
数据 。 

例 9-1: 创建 Web 服务， 返回 由 字母 和 数字 组 成 的 验证 码 数据 。 

(1) 启动 VWD 2010， 新 建 空 网 站 Chapter9 。 

(2) 打开 “添加 新 项 ”对 话 框 ， 选 择 “Web 服务 ”模板 ， 添 加 名 为 WebService.asmx 
的 Web 服务 。 

(3) 此 时 在 网 站 的 App_Code 文件 夹 下 会 自动 生成 一 个 名 为 WebService.cs 的 文件 ， 同 
时 在 网 站 目录 中 会 生成 WebService.asmx 文件 ， 如 网 9-3 所 示 。 

(4) 自动 生成 的 WebService.cs 文件 的 代码 如 下 所 示 : 


using System; 
using System.Collections.Generic; 
using System.Linq; 
using System. Web; 
using System. Web.Services; 
/// <summary> 
/I/WebService 的 摘要 说 明 
/// </summary> 
[WebService(Namespace = "http://tempuri.org/")] 
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfilel_1)] 
/车 要 允许 使 用 ASP.NET AJAX 从 脚本 中 调用 此 Web 服务 ， 请 取消 对 下 行 的 注释 。 
// [System.Web.Script.Services.ScriptService] 
public class WebService : System.Web.Services.WebService í 
public WebService () í 
/如 果 使 用 设计 的 组 件 ， 请 取消 注释 以 下 行 
//InitializeComponent(); 
} 
[WebMethod] 
public string HelloWorld) í 
return "Hello World": 
} 
} 


从 这 段 代 码 中 ， 可 以 找到 前 面 介绍 的 4 个 属性 : WebService、WebServiceBinding、 
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ScriptService 和 WebMethod。 其 中 ， 该 Web 服务 提供 了 一 个 HelloWorld 方法 ， 调 用 该 方 
法 将 返回 字符 串 Hello Word. 

(5) 无 须 添 加 和 修改 任何 代码 ， 即 可 启用 和 测试 Web 服务 HelloWorld。 这 里 我 们 适当 
修改 一 下 HellWorld 方法 ， 为 其 添加 一 个 参数 ， 返 回 Hello 加 参数 值 ， 修 改 后 的 代码 如 下 : 


[WebMethod] 
public string HelloWorld(string strName) í 
return "Hello "+strName; 


) 


(6) 编译 并 启动 应 用 程序 , 在 浏览 器 中 打开 WebService.asmx 文件 ， 显 示 服 务 支持 的 操 
作 ， 如 图 9-4 所 示 。 


g WebService Web 服务 - Windows Internet Explorer uon 


v > 已 localhost x] $| x 
文件 @ BEO SEV WQ) IAV KMW 
ABRR — @vasevice vo 服务 a-a oaoa ” 


解决 方案 资源 管理 器 PX 


lama map 


LZ a eteer +m 
AEN 


WebService | 
支持 下 列 拘 作 。 有 关 正式 定义 ， 请 查看 服务 说 明 . 


© Helloworld 


此 Web 服务 使 用 http: / /tempuri.org/ 作为 默认 命名 空间 
建议 : 公开 XML Web services 之 前 ,请 更 改 默认 命名 空间 。 


Z pe XML Web services 都 需要 一 个 唯一 的 命名 空间 ， 以 便 客 户 端 应 用 程序 能 外 将 i 


@ Internet far 1008 > 


图 9-3 ”生成 的 Web 服务 相关 的 文件 图 9-4 Web 服务 的 测试 页 面 


(7) 单 击 HelloWorld 链接 可 以 调用 该 方法 ， 如 图 9-5 所 示 。 
(8) 因为 该 方法 需要 一 ee strName， 所 以 在 “ 值 ”文本 框 中 输入 一 个 参数 
值 后 ， 单 击 “ 调 用 ”按钮 即 可 返回 调用 结果 ， 结 果 包含 在 一 个 XML 文件 中 ， 如 图 9-6 所 示 。 
WebService Web 服务 - Windows Internet Explorer [- D ËJ 


[=P= 四 
wO REO FEV KEAW IAW WHW 
RR | @vosevice to 服务 a-e- noe. ” 


WebService 


Mhiti, BREMEN. 


ë ET Si [s] 
HelloWorld XFO SAO FEV BARW IRW WHW 
测试 RRRA — veo /locdhost 11 a-a- aoe- ” 
荐 要 使 用 HTTP POST 协议 对 泊 作 进行 测 二 ,请 单 击 “ 调 用 ” 按 纪 EF 
参数 值 <?xml version="1.0" encoding="utf-8" ?> 
<string xmins="http:/ /tempuri.org/">Hello BA </string> 
strName: BB 
wm] 
` 
$] > 
@ internet far Rios ~ 3 @ Internet far Rios ~ 
图 9-5 调用 Web 服务 图 9-6 调用 Web 方法 返回 结果 


(9) 返回 WebService.cs 文件 ， 添 加 绘制 验证 码 的 Web 方法 ， 由 于 涉及 到 绘图 功能 
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所 以 在 要 文件 头 部 引入 所 需 的 命名 空间 ， 代 码 如 下 : 


using System.Drawing; 

using System.IO; 

using System.Drawing.Imaging: 
using System.Drawing.Drawing2D; 


(10) Web 方法 的 定义 如 下 : 


[WebMethod] 
public byte[] AuthCode(int length, string checkCode) 
í 
int bmpHeight = 25, bmpWidth = length * 25 + 15; /验证 码 图 片 的 高 度 和 宽度 
Bitmap bmp = new Bitmap(bmp Width, bmpHeight); 
int red, blue, green; 
Random rd = new Random(DateTime.Now.Millisecond); 
red = rd.Next(255) % 128 + 128;// 产 生 随 机 的 RGB 值 
blue = rd.Next(255) % 128 + 128; 
green = rd.Next(255) % 128 + 128; 
Graphics g = Graphics.FromImage(bmp); 
Brush brush = new SolidBrush(Color.FromArgb(red,green,blue));// 根 据 RGB 颜色 值 创建 
画 刷 
g.FillRectangle(brush, 0, 0, bmpWidth, bmpHeight); 
/画图 片 的 前 景 噪音 点 
for (int i = 0; i < 30; i+) 
{ 
int x = rd.Next(bmpWidth); 
int y = rd.Next(bmpHeight); 
bmp.SetPixel(x, y, Color.FromArgb(rd.Next())); 


) 
/画图 片 的 边框 线 
g.DrawRectangle(new Pen(Color.Silver), 0, 0, bmpWidth - 1, bmpHeight - 1); 
/画图 片 的 背景 噪音 线 
for (int i = 0; i < 25; i++) 
{ 
int x1 = rd.Next(bmpWidth); 
int x2 = rd.Next(bmpWidth); 
int y1 = rd.Next(bmpHeight); 
int y2 = rd.Next(bmpHeight); 
g.DrawLine(new Pen(Color.FromArgb(rd.Next0)), x1, y1, x2, y2); 
} 


Rectangle rect = new Rectangle(0, 0, bmpWidth, bmpHeight); 

LinearGradientBrush lgb = new LinearGradientBrush(rect, Color.BlueViolet, 
Color.DarkRed, 1.2f true); 

for (int i = 0; i < length; i+) 
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{// 绘 制 每 个 字符 
Font font = new Font("Courier New", 14 + rd.Next() % 4, (FontStyle.Bold | 
FontStyle.Italic)); 
g.DrawString(checkCode. Substring(i, 1), font, lgb, 2 + i * 25, 2 + rd.Next(2)); 
} 
MemoryStream stream = new MemoryStream(); 
bmp.Save(stream, ImageFormat.Gif); 
bmp.Dispose(); 
g-Dispose(); 
byte[] ret = stream.ToArray0;// 输 出 字 节 流 
stream.Close(); 
return ret; 


} 


上 述 代码 通过 WebMethod 属性 指定 该 方法 可 以 被 远程 调用 。 随 后 的 代码 是 绘制 验证 码 
的 方法 ， 该 方法 有 两 个 参数 ， 一 个 参数 是 验证 码 的 长 度 ， 另 一 个 参数 是 验证 码 字 符 串 。 

(11) 此 时 已 经 完成 Web 服务 的 创建 ， 可 以 像 刚 才 那 样 测试 该 方法 ， 此 时 还 看 不 到 验 
证 码 图 片 ， 我 们 得 到 的 将 是 通过 BASE64 编码 的 一 个 字符 串 。 

9.2.3 节 将 介绍 如 何 调用 Web 服务 ， 并 创建 页 面 调用 该 方法 。 


9.2.3 调用 Web 服务 


Web 服务 的 最 终 目 的 是 提供 一 种 服务 接口 ， 由 其 他 程序 调用 。 本 节 将 详细 介绍 如 何 调 
用 Web 服务 ， 包 括 调用 Web 服务 的 机 制 以 及 如 何 调用 Web 服务 。 
1. Web 服务 调用 机 制 


调用 Web 服务 的 第 一 步 就 是 先 找到 一 个 满足 需要 的 Web 服务 。 在 找到 一 个 服务 后 ， 
就 可 以 得 到 这 个 Web 服务 的 描述 信息 、 分 组 的 分 类 信息 和 绑 定 信息 。 然 后 根据 描述 信息 ， 
调用 相应 的 方法 。 

为 了 找到 已 经 存在 的 Web 服务 ，Microsoft、IBM 和 Ariba 合作 建立 了 一 个 带 有 UDDI 
服务 的 网 站 http://www.uddi.org。 如 果 一 个 公司 要 发 布 自己 的 Web 服务 ， 就 可 以 在 UDDI 
中 注册 它 。 有 了 UDDI 商务 注册 表 和 UDDI API， 就 可 以 编程 定位 Web 服务 的 信息 了 。 


说 明 : 
Web 服务 不 一 定 要 用 UDDI 注册 ， 也 可 以 从 其 他 资源 中 获取 Web 服务 的 信息 。 


调用 Web 服务 的 业务 流程 如 图 9-7 所 示 。 服 务 的 描述 信息 以 Web Services Description 
Language(Web 服务 描述 语言 ，WSDL) 格 式 显 示 。WSDL 文档 描述 了 Web 服务 支持 什么 方 
法 、 如 何 调用 这 些 方 法 、 给 服务 传送 的 参数 类 型 ， 以 及 调用 方法 返回 的 参数 类 型 。 


。278 ASPNET 4.0 网 站 开发 实例 教程 


Web 服 务 的 相关 信息 


图 9-7 调用 Web 服务 的 业务 流程 

技巧 : 

在 .asmx 文件 的 最 后 加 上 字符 串 ?wsdl 就 会 返回 一 个 WSDL 文档 。WSDL 文档 是 用 
WebMethod 属性 动态 生成 的 。 


2. 调用 Web 服务 


例 9-2: 调用 例 9-1 中 创建 的 验证 码 Web 服务 ， 实 现 验 证 码 功能 。 

(1) 启动 VWD 2010， 打 开 网 站 Chapter9。 

(2) 在 “解决 方案 资源 管理 器 ”窗口 中 ， 右 击 解决 方案 名 称 ， 从 弹出 的 快捷 菜单 中 选 
择 “ 添 加 服务 引用 ”命令 ， 打开“ 添加 服务 引用 ”对 话 框 ， 单 击 “ 发 现 ” 按 钮 即 可 搜索 到 
上 例 中 创建 的 Web 服务 ， 并 显示 了 当前 可 用 的 操作 ， 如 图 9-8 所 示 。 

(3) 默认 的 命名 空间 为 ServiceReference1, 稍 候 编 写 代 码 时 会 用 到 这 个 命名 空间 , 单 击 
“确定 ”按钮 将 添加 Web 服务 引用 ， 网 站 目录 会 自动 生成 一 个 名 为 App_WebReferences 
的 文件 夹 ， 其 中 包括 一 个 ServiceReferencel( 与 前 面 的 命名 空间 名 相同 ) 文 件 夹 ， 里 面 有 4 
个 文件 ， 如 图 9-9 所 示 。 


CO E) 
上 请 输入 服务 WRL, 烧 后 单 击 “ 竺 到 ”。 若 要 浏览 可 用 


= 
http: //1ocalhost:1107/Chapter3/et 


s | 解决 方案 资源 管理 器 
amo e| [lille 


O E-A... \Chapter9\ 


[<]. m 到 | 
EMRE hts /Tocalhost 107 /0hap 和 ET ABE T FRS 


Cas )[ wa ra [>J 
图 9-8 “添加 服务 引用 ”对 话 杠 图 9-9 生成 的 引用 文件 


(4) 由 于 Web 方法 AuthCode 返回 的 是 一 个 字 节 数组 ， 为 了 将 这 个 字 节 数组 表示 的 图 
片 显示 在 Image 控件 中 , 我 们 需要 添加 一 个 Web 页 面 , 添加 一 个 名 为 AuthCode.aspx 的 页 面 。 


第 9 章 Web 服务 。279。 


(5) 在 AuthCode .aspx 的 Load 事件 中 调用 Web 服务 的 AuthCode 方法 获取 验证 码 信息 ， 
代码 如 下 : 


protected void Page Load(object sender, EventArgs e) 
{ 


ServiceReferencel.WebServiceSoapClient c= new 
ServiceReferencel.WebServiceSoapClient(): 
string code = genCode(); 
byte[] data = c.AuthCode(code.Length, code); 
Response.ContentType = "image/gif"; 
Response.OutputStream. Write(data, 0, data.Length); 
) 


(6) 上 述 代码 首先 实例 化 Web 服务 的 对 象 , 然后 调用 AuthCode 方法 获取 验证 码 图 片 ， 
验证 码 是 通过 genCode 方法 生成 的 一 个 算式 ， 相 应 的 代码 如 下 所 示 : 


private string genCode() 
{ 

char[] ops = { 加 ' 减 "乘除 ' }; 

int number1,number2,opNum,result=0; 

string checkCode = String.Empty; 

Random rd = new Random(DateTime.Now.Millisecond); 

numberl = rdNext(10):// 产 生 第 1 个 数字 

number2 = rdNext(10):// 产 生 第 2 个 数字 

opNum = rdNext(4);// 产 生 操作 符 对 应 的 数字 (0,1.2.3 对 应 加 , 减 , 乘 , 除 ) 

switch (opNum) 

{ 

case 0: 
checkCode = number1.ToString() + ops[opNum] + number2+"=?"; 
result = numberl + number2; 
break; 
case 1: 
if (number1 < number2) 
{ 
checkCode = number2.ToStringO + ops[opNum] + "?=" + number1; 
result = number2 - number1; 


j; 

else 

{ 
checkCode = number1.ToString() + ops[opNum] + "?=" + number2; 
result = number1 - number2; 

} 

break: 

case 2: 


checkCode = number1.ToString() + ops[opNum] + number2 + "=?"; 
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result = numberl * number2; 
break; 
case 3:// 除 法 操作 中 不 能 出 现 0 
if (number1 == 0) 
number] = rd.Next(9)+1; 
if (number2 == 0) 
number2 = rd.Next(9)+1; 
result = number1 * number2; 
checkCode = result.ToString() + ops[opNum] + "?=" + number2; 
result = number! ; 
break; 
default: 
break; 
5 
Session["result"] = result; 
return checkCode; 
} 


在 genCode 方法 最 后 将 生成 的 验证 码 算式 的 正确 答案 保存 到 Session 变量 中 。 等 用 户 
输入 验证 码 提交 后 ， 将 从 Session 变量 中 获得 该 信息 ， 验 证 用 户 的 输入 是 否 正确 。 

(7) 通过 “添加 新 项 ”对 话 框 添加 一 个 名 为 Test.aspx 的 测试 页 面 ， 在 Test.aspx 的 源 代 
码 视图 中 添加 如 下 代码 : 


<form id="form1" runat="server"> 
<div> 
验证 码 : <asp:TextBox ID="TextBoxl" runat="server"></asp:TextBox> 
<asp:Image ID="Image1" runat="server" ImageUrl="~/AuthCode.aspx" /> 
<asp:HyperLink ID="HyperLinkl" runat="server" NavigateUrl="~/Test.aspx"> 看 不 清 ， 换 
-个 </asp:HyperLink> 
</div> 
<asp:Button ID="Buttonl" runat="server" onclick="Buttonl_Click" Text=" 提 交 " /> 
</form> 


上 述 代 码 中 Image 控件 的 ImageUrl 属性 指定 为 AuthCode.aspx 文件 ，HyperLink 控件 
用 于 刷新 页 面 以 便 重 新 获取 新 的 验证 码 图 片 。 
(8) 在 Button 控件 的 单 击 事件 处 理 程序 中 添加 如 下 代码 : 


protected void Button1_Click(object sender, EventArgs e) 
{ 
1f(Session["result"].ToString( 一 TextBox1.Text.Trim()) 
Response.Write("<script>alert(' 验 证 码 输入 正确 ! );</script>"); 
else 
Response.Write("<script>alert(' 验 证 码 输入 有 误 ! </script>"); 
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(9) 至 此 ， 完 成 所 有 代码 的 编写 。 编 译 并 运行 程序 ， 在 浏览 器 中 打开 Test.aspx 页 面 ， 
效果 如 图 9-10 所 示 。 

(10) 计算 验证 码 所 示 算 式 的 结果 ， 输 入 到 文本 框 中 ， 单 击 “ 提 交 ” 按 钮 ， 将 弹出 验证 
成 功 对 话 框 ， 如 图 9-11 所 示 。 如 果 看 不 清 验 证 码 图 片 ， 则 可 以 单 击 “ 看 不 清 , 换 一 个 图 片 ” 
超 链接 重新 获取 验证 码 ， 如 图 输入 的 结果 有 误 ， 还 将 弹出 相应 的 提示 对 话 框 。 
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图 9-10 调用 Web 服务 获取 验证 码 图 片 图 9-11 验证 成 功 对 话 杠 


9.3 AJAX 和 Web 服务 


典型 的 AJAX 体系 结构 非常 容易 理解 。 其 工作 原理 如 图 9-12 所 示 , 其 中 有 一 个 由 应 用 
程序 特定 服务 组 成 的 后 端 ， 通 常 只 可 调用 AJAX 脚本 的 外 层 ， 其 下 方 是 业务 轴 辑 所 在 和 发 
挥 作用 的 系统 中 间 层 。 服 务 与 前 端 通过 HTTP 交换 数据 , 使 用 多 种 格式 传递 参数 和 返回 值 。 
前 端 由 运行 于 客户 端 上 的 JavaScript 代码 组 成 ， 在 接收 和 处 理 完 数据 后 ， 它 面临 着 使 用 
HTML 和 JavaScript 构建 图 形 用 户 界面 的 重大 任务 。 对 JavaScript 的 依赖 是 由 于 受 浏 览 器 结 
构 的 限制 ， 只 有 当 浏 览 器 可 以 支持 功能 更 加 强大 的 编程 功能 时 ， 这 种 情况 才 会 改变 。 


前 端 ( 含 JavaScript) 


后 端 ( 含 Web 服务 ) 
| 其 他 后 端 层 | 


图 9-12 ”典型 的 AJAX 体系 结构 


本 节 将 介绍 如 何 创建 支持 AJAX 的 Web 服务 ,以 及 如 何在 AJAX 站 点 中 调用 页 面 方法 。 
页 面 方法 是 与 Web 服务 类 似 的 一 种 技术 , 所 不 同 的 是 , 页 面 方法 直接 在 现 有 的 ASPX 页 面 
内 定义 ， 而 不 是 在 单独 的 ASMX 文件 中 定义 。 且 只 能 从 页 面 运行 的 脚本 中 调用 页 面 方法 。 
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最 适合 AJAX 应 用 程序 的 服务 主要 涉及 向 Web 客户 端 公开 数据 和 资源 。 它 可 以 通过 
HTTP 获得 ， 并 要 求 客户 端 使 用 URL( 也 可 以 是 HTTP 头 ) 访 问 数据 和 命令 操作 。 
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已 经 介绍 过 只 需 将 [System.Web.Script Services.ScriptService] 前 面 的 注释 符号 删除 ， 即 
可 将 整个 服务 提供 为 客户 端 脚本 服务 。 


1. 创建 支持 AJAX 的 Web 服务 


例 9-3: 创建 支持 AJAX 的 Web 服务 ， 添 加 Web 方法 ， 根 据 用 户 登 录 名 从 WeiBo 数 
据 库 中 查询 相应 的 用 户 信息 。 

(1) 启动 VWD 2010， 打 开 网 站 Chapter9。 

(2) 通过 “添加 新 项 ”对 话 框 ， 添 加 名 为 WebService2.asmx 的 Web 服务 。 

(3) 打开 WebService2.cs 文件 , 删除 [System.Web.Script.Services.ScriptService] 属 性 前 面 
的 注释 符号 。 

(4) 由 于 要 访问 数据 库 ， 所 以 需要 使 用 using 语句 引入 相应 的 命名 空间 : 


using System.Data.SqlClient; 
using System.Data.Sql; 


(5) 为 了 方便 返回 用 户 信息 ， 定 义 一 个 结构 体 User， 代 码 如 下 : 


public struct User 

{ 
public int user_id; 
public string user_name; 
public string user_login; 
public string user_sex; 
public string user_email; 
public string user_address; 
public string user_telephone; 
public string user_info; 

} 


(6) 将 数据 库 的 连接 字符 串 添加 到 web. config 文件 中 的 ConnectionString 中 , 配置 信息 
如 下 : 


<connectionStrings> 
<add name="WeiBoConnectionString" connectionString="Data 
Source=zhao\sqlexpress;Initial Catalog=WeiBo;Integrated Security=True" 
providerName="System.Data.SqlClient" /> 
</connectionStrings> 


(7) 添加 using 语句 引入 System.Web.Configuration: 命 名 空间 。 
(8) 添加 Web 方法 ， 通 过 连接 数据 库 查询 指定 用 户 的 信息 ， 代 码 如 下 : 


[WebMethod] 
public User GetUserByLogin(string user login) 
{ 


User user = new User(); 
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string strConnect = 
WebConfigurationManager.ConnectionStrings["WeiBoConnectionString"].ConnectionString; 

SqIConnection con = new SqIConnection(strConnect); 

con.Open(); 


SqlCommand cmd = new SqICommand("select 


user id,user name,user sex,user email,user address,"+ 
"user telephone,user_info from Z_USER where user login = (@user login", con); 
cmd. Parameters. AddWithValue("(@@user_login", user login); 
SqlDataReader reader = cmd.ExecuteReader(); 
站 (reader.Read0)// 获 取 查 询 结 果 


{ 
User.user id = reader.GetInt32(0); 
User.user name = reader.GetString(1); 
User.user_ sex = reader.GetString(2); 
User.user email = reader.GetString(3); 
user.user_address = reader.GetString(4); 
user.user_telephone = reader.GetString(5); 
user.user_info = reader.GetString(6); 
user.user_login = user_login; 

) 

else 
user.user id = -1;// 表 示 查 询 的 登录 名 不 存在 
cmd = null: 

con.Close0; 

con = null; 

return user; 


) 


(9) 至 此 完成 Web 服务 的 创建 ， 可 以 在 浏览 器 中 加 载 并 测试 该 服务 了 。 
2. 在 AJAX 站 点 中 使 用 Web 服务 


在 第 8 章 介绍 过 ，S 
它 注册 客户 端 JavaScript 


criptManager 控件 几乎 是 所 有 与 Ajax 相关 的 操作 中 必 不 可 少 的 。 
文件 , 负责 使 用 UpdatePanel 更 新 部 分 页 面 , 可 以 将 ScriptManager 


添加 到 单个 页 面 中 ， 也 可 以 添加 到 母 版 页 中 ， 让 它 变 得 在 整个 站 点 上 都 可 用 。 
使 用 Web 服务 时 ， 需 要 告知 ScriptManager 要 给 客户 端 脚本 提供 Web 服务 。 有 两 种 方 


法 可 以 实现 。 
e 在 母 版 页 中 的 Sc 


riptManager 中 。 


e 在 使 用 Web 服务 的 内 容 页 中 使 用 ScriptManagerProxy 控件 。 
要 在 全 部 或 大 多 数 页 面 中 使 用 Web 服务 ， 最 好 是 在 母 版 页 的 ScriptManager 中 声明 
Web 服务 。 给 ScriptManager 控件 提供 一 个 <Services> 元 素 ， 该 元 素 再 包含 指向 公共 服务 的 


一 个 或 多 个 ServiceReference 元 素 。 


通过 在 母 版 页 中 引 月 


目 Web 服务 , 该 Web 服务 将 在 基于 这 个 母 版 页 的 所 有 页 面 都 可 用 。 


这 也 意味 着 每 个 页 面 都 要 下 载运 行 这 个 服务 所 需 的 JavaScript 文件 。 如 果 页 面 根本 没有 使 
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Web 服务 ， 也 会 浪费 带宽 和 资源 。 因 此 ， 对 于 只 在 一 些 页 面 上 使 用 的 服务 ， 最 好 引用 页 


面 本 身 的 服务 。 如 果 使 用 的 母 版 页 有 ScriptManager 控件 ， 那 么 在 内 容 页 中 就 要 使 用 


ScriptManagerProxy 控件 。 下 面 的 例 9-4 将 介绍 如 何在 内 容 页 中 使 


件 来 注册 Web 服务 。 


ScriptManagerProxy 控 


例 9-4: 在 AJAX 站 点 中 的 内 容 页 中 使 用 ScriptManagerProxy 控件 调用 Web 服务 。 

(1) 启动 VWD 2010， 打 开 网 站 Chapter9 。 

(2) 为 了 演示 内 容 页 中 使 用 ScriptManagerProxy 控件 来 注册 Web 服务 ， 我 们 需要 先 创 
建 一 个 母 版 页 。 通 过 “添加 新 项 ”对 话 框 添加 一 个 母 版 页 MasterPage.master。 

(3) 在 母 版 页 中 添加 一 个 ScriptManager 控件 。 


praen 
Ea: 


ScriptManager 控件 必须 添加 在 ContentPlaceHolder 控件 的 外 部 。 


(4) 基于 母 版 页 MasterPage master 创建 名 为 AjaxWebServiceTest.aspx 的 页 面 。 
(5) 在 AjaxWebServiceTest.aspx 页 面 中 添加 一 个 ScriptManagerProxy 控件 ， 在 “属性 ” 
面板 中 设置 控件 的 Services 属性 ， 这 是 一 个 集合 属性 ， 单 击 属性 右 侧 的 省 略 号 将 打开 
“ServiceReference 集合 编辑 器 ”对 话 框 。 单 击 “ 添 加 ”按钮 ， 添 加 一 个 成 员 ， 设 置 Path 
值 为 前 面 创建 的 Web 服务 WebService2.asmx， 如 图 9-13 所 示 。 切 换 到 “ 源 ” 视 图 ， 可 以 


看 到 生成 的 代码 ， 如 下 所 示 : 


<asp:ScriptManagerProxy ID="ScriptManagerProxy1" runat="server"> 


<Services> 


<asp:ServiceReference Path="~/WebService2.asmx" /> 


</Services> 


</asp:ScriptManagerProxy> 


6 
ServiceReference MAREA 
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of Moservie amr + 


+ 
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所 引用 服务 的 路 径 。 
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图 9-13 


“ServiceReference 集合 编辑 器 ”对 话 框 


(6) 在 <ScriptManagerProxy> 的 结束 标记 下 方 ， 添 加 一 个 Input (Text) 和 一 个 Input 
(Button)， 并 输入 相应 的 文本 提示 信息 ， 然 后 添加 一 个 <div> 标 记 ， 用 于 显示 返回 信息 。 


按 登 录 名 查询 微 博 用 户 信息 : <input id="Textl" type="text" /> 
<input id="Button1" type="button" value=" 查 询 " /> 


<div id="user"></div> 
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(7) 在 上 述 代码 的 下 面 添加 客户 端 JavaScript 代码 块 : 


<script type="text/javascript"> 
function GetWebMethod() í 
WebService2.GetUserByLogin($get('Text1').value, onSuccCallback, onFailCallback); 
} 
function onSuccCallback(result) í 
var info; 
info = "用 户 ID: "+resultuser id; 
info += "<br> 姓 名 : "+ result.user name; 
info += "<br> 登 录 名 : "+ resultuser login; 
info += "<br> 性 别 : "+ result.user sex; 
info += "<br>Email: "+result.user email; 
info += "<br> 地 址 : "+ result.user address; 
info += "<br> 电 话 : "+ result.user telephone: 
info += "<br> 个 人 介绍 : "+ resultuser info; 
if (result.user_id == -1) 
info = "查询 的 登录 名 不 存在 " 
$get('user').innerHTML = info: 
} 
function onFailCallback(error) { 
alert(error.toString); 
} 
$addHandler($get('Button1'), 'click', GetWebMethod); 
</script> 


(8) 编译 并 运行 程序 ， 输 入 一 个 登录 名 ， 然 后 单 击 “ 查 询 ” 按 钮 ， 结 果 如 图 9-14 所 示 。 
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图 9-14 页 面 运行 效果 


932 在 AJAX 站 点 中 调用 页 面 方法 


页 面 方法 和 Web 服务 有 一 些 共同 之 处 。 两 者 都 可 以 使 用 很 少 的 代码 在 客户 端 调 用 。 可 
以 向 它们 发 送 数据 ， 并 接收 回 发 的 数据 。 另 外 ， 当 调用 它们 时 ， 可 以 定义 成 功 和 失败 回调 
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方法 。 两 者 的 不 同 之 处 在 于 ， 页 面 方法 直接 在 现 有 的 ASPX 页 面 内 定义 ， 而 不 是 在 单独 的 
ASMX 服务 文件 中 定义 。 

要 启用 页 面 方法 ， 需 要 将 ScriptManager 控件 的 EnablePageMethods 属性 设置 为 True, 
ScriptManagerProxy 控件 上 没有 该 属性 ， 因 此 需要 直接 在 ScriptManager 控件 上 进行 设置 。 

例 9-5: 在 AJAX 站 点 中 调用 页 面 方法 。 

(1) 启动 VWD 2010， 打 开 建 网 站 Chapter9。 

(2) 通过 “添加 新 项 ”对 话 框 添加 一 个 名 为 WebMethod.aspx 的 页 面 ， 在 页 面 中 添加 一 
个 ScriptManager 控件 ， 设 置 控件 的 EnablePageMethods 属性 为 True。 

G) 打开 页 面 的 后 台 代码 文件 WebMethod.aspx.cs， 添 加 如 下 页 面 方法 : 


[WebMethod] 
public static string Welcome(string strName) 
{ 
return string.Format(" 你 好 {0}", strName); 
} 


提示 : 
在 添加 上 述 代 码 之 前 需要 首先 引入 所 需 的 using System.Web.Services: 命 名 空间 。 


(4) 切换 到 WebMethod.aspx 页 面 的 “ 源 ” 视 图 ， 在 </ScriptManager> 标 记 下 面 添 加 一 
个 Input(text) 和 一 个 Input (Button) 控 件 ， 方 法 是 从 工具 箱 的 HTML 类别 中 拖 动 它们 。 将 按 
钮 的 value 设置 为 “提交 ”。 相 应 的 代码 如 下 : 


<input id="Text1" type="text" /> 
<input id="Button1" type="button" value=" 提 交 " /> 


(5) 接 下 来 ， 添 加 客户 端 脚 本 调用 页 面 方法 Welcome， 代 码 如 下 : 


<script type="text/javascript"> 
$addHandler($get('Button1'), 'click', WebMethodTest); 
function WebMethodTestO í 
var name = $get('Text1').value; 
PageMethods.Welcome(name, SuccCallback); 
} 
function SuccCallback(result) í 
alert(result); 
$ 
</script> 


(6) 编译 并 运行 程序 ， 输 入 一 个 用 户 名 ， 单 击 “ 提 交 ” 按 钮 ， 如 图 9-15 所 示 。 
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图 9-15 ”调用 页 面 方法 允许 效果 
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Web 服务 是 一 个 通过 URL 识别 的 软件 应 用 程序 , 其 界面 及 绑 定 能 用 XML 文档 来 定义 、 
描述 和 发 现 , 使 用 基于 Internet 协议 上 的 消息 传递 方式 与 其 他 应 用 程序 进行 直接 交互 。Web 
服务 支持 在 Web 站 点 上 放置 可 编程 的 元 素 ， 使 得 Internet 成 为 一 个 可 以 无 限 扩展 、 拥 有 无 
限 潜 力 的 分 布 式 计算 平台 。 利用 Web 服务 ,公司 和 个 人 将 能 够 迅速 且 廉 价 地 向 整个 互联 网 
络 提供 他 们 的 服务 。Web 服务 具有 互 操 作 性 、 普 遍 性 、 松 散 耦 合 和 高 度 可 集成 能 力 。 
ASP.NET AJAX 框架 会 为 Web 服务 自动 生成 JavaScript 代理 ， 然 后 通过 使 用 代理 来 调用 
Web 方法 。 本 章 详细 介绍 了 ASP.NET Web 服务 体系 架构 ， 使 用 VWD 创建 和 调用 Web JR 
务 ， 以 及 支持 AJAX 的 Web 服务 的 创建 与 调用 机 制 ， 最 后 介绍 了 页 面 方法 的 创建 与 使 用 。 

通过 本 章 的 学 习 ， 读 者 应 掌握 ASP.NET Web 服务 的 创建 方法 和 调用 机 制 ， 能 够 将 自 
己 的 程序 功能 封装 成 Web 服务 供 其 他 互联 网 用 户 使 用 。 


9.5 思考 和 练习 


. 简 述 调用 Web 服务 的 机 制 和 工作 原理 。 
. 如 何 创建 支持 AJAX 的 Web 服务 ? 
. 调用 天 气 预报 Web 服务 获取 国内 大 城市 的 天 气 信息 。 
. 创建 一 个 支持 AJAX 的 Web 服务 。 
. 页 面 方法 和 Web 服务 有 何 异 同 点 ? 
6. 登录 http://www.webxml.com.cn/zh_cn/support.aspx， 选 自己 喜欢 的 Web 服务 ， 进 行 
编程 练习 。 


Q + Q N 一 
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JavaScript 作为 Web 开发 的 客户 端 标准 语言 ,逐渐 被 人 们 所 重视 。 但 是 当 掌握 JavaScript 
语言 的 基本 用 法 之 后 ， 就 会 发 现 JavaScript 用 法 比较 繁琐 ,直接 使 用 DOM 来 控制 文档 ， 直 
接 调用 XMLHttpRequest 组 件 来 操作 数据 都 显得 很 麻烦 。jQuery 是 继 Prototype 之 后 又 一 个 
优秀 的 JavaScript 框架 , jQuery 能 够 改变 编写 JavaScript 脚本 的 方式 , 降低 学 习 和 使 用 Web 
前 端 开发 的 复杂 度 ， 提 高 网 页 开发 效率 ， 无 论 对 于 JavaScript 初学 者 ， 还 是 Web 开发 资深 
专家 ，jQuery 都 应 该 是 必 备 的 工具 。 本 章 将 主要 介绍 jQuery 的 基本 语法 和 有 具体 应 用 。 
jQuery 简介 
jQuery 选择 器 
jQuery 筛选 器 
使 用 jQuery 增强 页 面 
使 用 jQuery 插件 
jQuery 与 Ajax 


10.1 jQuery 简介 


jQuery 最 早 由 John Resig 在 2006 年 1 月 开发 和 发 布 ,现在 已 经 成 长 为 一 个 备 受 欢迎 的 
客户 端 框架 .Microsoft 也 注意 到 jQuery 的 强大 功能 , 并 决定 在 自己 的 产品 中 附送 这 个 框架 。 
最 初 ， jQuery 随 Microsoft ASP.NET MVC 框架 一 起 提供 ， 现 在 Visual Studio 和 Visual Web 
Developer 2010 中 也 包含 了 这 个 框架 。 


10.1.1 jQuery 概述 


jQuery 具有 如 下 特点 。 

e 语法 简练 、 语 义 易 懂 、 学 习 快 速 、 丰 富 文档 。 

e jQuery 是 一 个 轻 量 级 的 脚本 , 其 代码 非常 小 巧 , 最 新 版 的 jQuery 框架 文件 仅 有 30KB 
左右 。 

© jQuery 支持 CSS1~CSS3 定义 的 属性 和 选择 器 ， 以 及 基本 的 xPath 技术 。 

o jQuery 是 跨 浏览 器 的 ， 它 支持 几乎 所 有 主流 的 浏览 器 , 包括 IE 6.0+、FireFox 1.5+、 
Safari 2.0+ 和 Opera 9.0+ 等 。 

e 可 以 很 容易 地 为 jQuery 扩展 其 他 功能 。 
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o 能 将 JavaScript 脚本 与 HTML 源 代码 完全 分 离 ， 便 于 后 期 编辑 和 维护 。 

e 插件 丰富 ， 除 了 jQuery 自身 带 有 的 一 些 特效 外 ， 可 以 通过 插件 实现 更 多 功能 ， 锥 
表单 验证 、Tab 导航 、 拖 放 效 果 、 表 格 排序 、DataGrid、 树 形 菜单 、 RA 
Ajax 上 传 等 。 

jQuery 库 的 主要 关注 点 一 直 是 简化 访问 Web 页 面 元 素 的 方法 、 帮 助 处 理 客户 端 事件 、 
提供 视觉 效果 (如 动画 ) 支 持 , 以 及 让 应 用 程序 中 使 用 Ajax 变 得 更 加 简单 .2006 年 1 月 , John 
Resig 公布 了 jQuery 的 第 一 版 ， 然 后 在 2006 年 8 月 正式 发 布 了 jQuery 1.0。 后 来 又 陆续 发 
布 了 许多 版 本 ， 目 前 最 新 的 稳定 版 本 是 jQuery 1.4.1。 

使 用 ASPNET Web 站 点 模板 创建 的 Web 站 点 都 包含 一 个 Scripts 文件 夹 , 其 中 已 经 包 
含 了 必要 的 jQuery 文件 。 如 果 基 于 ASP.NET 空 Web 站 点 模板 建立 网 站 ， 也 可 以 手动 向 
Web 站 点 添加 jQuery 文件 .引入 jQuery 框架 文件 之 后 便 可 在 页 面 脚本 中 调用 jQuery 对 象 、 
方法 或 属性 ， 并 以 jQuery 特色 语法 规范 来 编写 脚本 。 

可 以 从 jQuery 的 官方 网 站 http://jquery.com 上 下 载 jQuery 的 最 新 版 本 。 该 网 站 不 但 提 
供 了 可 以 下 载 的 文件 , 还 提供 了 文档 、FAQ、 教程 和 其 他 有 助 于 更 好 地 利用 jQuery 的 信息 。 


说 明 : 
因为 jQuery 库 会 增加 网 页 的 大 小 ， 所 以 应 该 明确 决定 是 否 在 Web 站 点 中 包含 它 。 


10.1.2 在 Web 站 点 中 引用 jQuery 


要 在 Web 站 点 中 包含 jQuery， 有 几 种 选项 可 供 选择 。 

o 只 在 需要 jQuery 的 网 页 或 者 用 户 控件 中 添加 对 jQuery 库 的 引用 。 这 种 方式 可 以 有 
效 地 减 小 页 面 大 小 。 当 用 户 浏览 没有 使 用 jQuery 的 页 面 时 ， 就 不 需要 下 载 jQuery 
库 文件 。 而 当 它 们 下 载 了 库 文件 以 后 , 浏览 器 就 会 缓存 库 文件 的 一 个 副本 ， 从 而 使 
得 在 以 后 访问 页 面 时 ， 不 需要 再 次 下 载 这 些 文件 。 

e 在 Web 站 点 的 母 版 页 中 添加 对 jQuery 库 的 引用 ， 从 而 使 所 有 的 页 面 都 可 以 使 用 
jQuery 库 。 这 种 方式 十 分 方便 , 因为 所 有 基于 该 母 版 页 创建 的 页 面 都 会 自动 获得 对 
jQuery 的 访问 权 。 但 是 ， 这 会 对 Web 站 点 第 一 个 页 面 的 性 能 造成 冲击 ， 因 为 需要 
从 服务 器 上 下 载 库 文件 。 

由 于 jQuery 库 很 小 ， 所 以 一 般 是 在 母 版 页 中 包含 它 。 又 由 于 jQuery 库 由 一 个 使 用 

JavaScript 代码 编写 的 文件 组 成 , 所 以 可 以 使 用 标准 的 <scrip 亿 语法 对 jQuery 库 的 引用 , 例如 : 


<script src=" jquery-1.4.1.min.js" type="text/javascript"></script> 


必须 使 用 一 个 独立 的 结束 </scrip 亿 标记， 因为 如 果 使 用 自 结束 标记 ， 一 些 浏览 器 将 无 
法 正常 运行 代码 。 

也 可 以 将 引用 嵌入 到 ScriptManager 控件 中 。ScriptManager 控件 有 一 个 <Scripts> 子 元 
素 ， 可 以 用 来 注册 将 会 添加 到 浏览 器 的 最 后 一 个 页 面 的 JavaScript 文件 。 在 ScriptManager 
中 注册 JavaScript 文件 的 最 简 形 式 如 下 所 示 : 
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<asp:ScriptManager ID="ScriptManager1" runat="server"> 
<Scripts> 
<asp:ScriptReference Path="~/Scripts/jquery-1.4.1.min.js" /> 
</Scripts> 
</asp:ScriptManager> 


另外 一 种 方法 是 使 用 Microsoft 的 内 容 传 送 网 络 (Content Delivery Network, 简称 CDN) 
或 Google Code 引用 jQuery 库 的 在 线 版 本 。 

使 用 外 部 库 的 在 线 版 本 的 优势 在 于 可 以 提升 服务 器 的 性 能 并 降低 带宽 。 因 为 站 点 的 访 
问 者 很 可 能 已 经 在 访问 另外 一 个 站 点 的 时 候 下 载 了 共享 脚本 。 


10.1.3 jQuery 示例 


为 了 更 好 地 了 解 jQuery， 下 面 先 来 看 一 个 简单 的 例子 。 在 本 例 中 ， 将 在 当前 页 面 中 添 
加 jQuery 库 。 通 过 单 击 按钮 来 改变 表单 的 背景 色 。 
例 10-1: 使 用 jQuery 示例 。 
(1) 启动 VWD2010， 新 建 空 网 站 Chapter10。 
(2) 由 于 创建 的 是 空 网 站 ， 所 以 需要 手动 添加 jQuery 库 。 首 先 在 站 点 的 根 文件 夹 中 添 
加 一 个 新 的 Scripts 文件 夹 。 
(3) 接 下 来 , 将 jQuery 库 文件 添加 到 Scripts 目录 中 。 可 以 有 如 下 几 种 方法 得 到 jQuery 
库 文件 。 
° 从 jQuery 网 站 下 载 最 新 的 jQuery 库 文件 。 
e° 从 本 书 附带 的 代码 文件 夹 中 找到 本 章 创 建 的 网 站 ， 从 Scripts 目录 中 复制 jQuery 库 
文件 到 读者 所 在 的 机 器 中 。 
e 从 Visual Studio 2010 的 安装 目录 中 找到 ProjectTemplatesCache 子 目 录 , 这 是 创建 工程 时 
使 用 的 模板 目录 ， 依 次 打开 子 文件 夹 Web/CSharp/2052/WebApplication40.zip/Scripts, 
该 目录 下 的 文件 就 是 jQuery 库 文 件 。 
通过 VWD 模板 创建 的 网 站 ，Scripts 目录 中 通常 有 3 个 js 扩展 名 的 JavaScript 文件 。 
其 中 ,jquery-1.4.1jjs 是 完整 的 jQuery1.4 库 文件 ,jquery-1.4.1.min.js 是 该 库 文件 的 简化 版 本 ， 
而 jquery-1.4.1-vsdoc.js 是 “智能 感知 ”文档 文件 ， 只 在 VWD 内 使 用 。 
(4) 通过 “添加 新 项 ”对 话 框 添加 一 个 名 为 jQueryTest.aspx 的 页 面 。 
(5) 切换 到 jQueryTest.aspx 的 “ 源 ” 视 图 , 在 <head> 标 记 中 添加 如 下 代码 引入 jQuery 库 : 


<script sre="Scripts/jquery-1.4.1.min.js" type="text/javascript"></script> 


(6) 在 <div> 标 记 中 添加 2 个 Input(Button) 控 件 。 控 件 的 value 属性 分 别 为 “红色 ”和 
“ 蓝 色 ”。 生 成 的 代码 如 下 : 


<input id="Button1" type="button" value=" 红 色 " /> 
p <input id="Button2" type="button" value=" 蓝 色 " /> 
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(7) 在 上 述 代码 的 下 面 添加 如 下 脚本 代码 : 


<script type="text/javascript"> 
$(document).ready(function O í 
$('#form1').css('background-color', 'green') 
$(#Button1').click(function O í 
$('#forml1').css('backeround-color', 'red') 
-animate({ width: '300px', height: '200px' }) 
1): 
$('#Button2').click(function (| í 
$('#form1').css('background-color', 'blue') 
-animate( í width: '350px', height: '150px' 1) 
J): 
p); 


</script> 
提示 : 
和 其 他 许多 编程 语言 一 样 ，JavaScript( 以 及 jQuery) 对 缺少 引号 、 大 括号 和 小 括号 十 分 
敏感 ， 所 以 一 定 要 完全 按照 上 面 的 代码 进行 输入 。 在 输入 代码 时 , “智能 感知 ”将 会 弹出 ， 


并 通过 工具 提示 提供 关于 各 种 方法 和 参数 的 信息 。 如 果 没 有 弹出 “智能 感知 "， 那 么 可 能 
没有 正确 添加 <script> 元 素 。 


(8) 编译 并 运行 程序 ， 在 默认 浏览 器 中 打开 jQueryTest.aspx 页 面 ， 如 图 10-1 所 示 ， 表 
单 背 景色 为 绿色 ， 而 且 仅 为 一 长 条 。 


(9) 单 击 “ 红 色 ” 按 钮 ， 将 把 背景 色 设置 为 红色 ， 大 小 为 (300X200)， 如 图 10-2 所 示 。 
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图 10-1 初次 加 载 页 面 效果 图 10-2 单 击 “ 红 色 ” 按 钮 后 的 效果 


上 述 代码 中 ， 添 加 了 一 个 标准 的 <scrip 己 块 ， 其 中 可 以 包含 JavaScript。 在 这 个 语句 块 
H, 添加 了 一 些 在 浏览 器 加 载 页 面 完 成 后 触发 的 jQuery 代码 。 页 面 就 绪 后 ,起 始 大 括号 ({) 
和 结束 大 括号 9) 之 间 的 代码 将 会 执行 ， 下 面 是 “文档 就 绪 函数 ”的 示例 : 
<script type="text/javascript"> 
$(document).ready(function() { 
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// Remainder of the code skipped 
)): 


</script> 


本 例 读 者 只 需 了 解 jQuery 的 实际 应 用 即 可 ， 接 下 来 将 详细 介绍 jQuery 的 语法 。 
10.2 jQuery 语法 


要 想 理解 和 使 用 jQuery， 需要 掌握 一 些 基础 知识 。 本 节 将 介绍 jQuery 的 核心 功能 ， 包 
括 前 面 看 到 的 $ 函 数 ， 以 及 $ 函 数 的 ready 方法 。 接 下 来 介绍 jQuery 的 选择 器 和 筛选 器 ， 这 
样 就 可 以 通过 自己 指定 的 条 件 在 页 面 中 查找 元 素 。 当 获得 一 个 指向 页 面 中 一 个 或 多 个 元 素 
的 引用 后 ， 就 可 以 对 它们 应 用 多 种 方法 ， 如 已 经 提 到 过 的 css 方法 。 


10.21 ready 函数 


大 部 分 jQuery 代码 都 是 在 浏览 器 完成 页 面 加 载 后 执行 。 等 到 页 面 完成 DOM 加 载 后 再 
执行 代码 十 分 重要 。DOM(Document Object Model, Bl: 文档 对 象 模型 ) 是 Web 页 面 的 一 种 
分 层 表 示 ， 包 含 所 有 HTML 元 素 、 脚 本 文件 、CSS 和 图 像 等 的 一 个 树 形 结构 。 如 果 借 助 编 
程 修改 DOM( 如 使 用 jQuery 代码 )， 那 么 这 种 修改 将 反映 在 浏览 器 中 显示 的 页 面 上 。 如 果 
过 早 执行 jQuery 代码 (如 在 页 面 的 最 顶端 )， 那 么 DOM 可 能 还 没有 加 载 完成 脚本 中 引用 的 
全 部 元 素 时 就 产生 了 错误 。 幸 运 的 是 ， 可 以 使 用 jQuery 中 的 ready 函数 ， 将 代码 的 执行 推 
迟到 DOM 就 绪 。 

ready 函数 的 声明 格式 如 下 : 

$(document)ready(function0O í 
/DOM 就 绪 后 执行 此 处 的 代码 
)); 
当 页 面 准 备 就 绪 ， 可 以 执行 DOM 操作 时 ， 添 加 到 起 始 和 结束 大 括号 之 间 的 全 部 代码 
都 将 执行 。jQuery 也 提供 了 ready 函数 的 一 个 快捷 方式 ， 下 面 的 代码 段 与 前 面 的 效果 相同 : 
$(functionO í 
// DOM 就 绪 后 执行 此 处 的 代码 
D: 


10.2.2 ”选择 器 


在 jQuery P, 可 以 使 用 美元 符号 ($) 作 为 在 页 面 中 查找 元 素 的 快捷 方式 。 找 到 并 返回 的 
元 素 称 为 匹配 集 。$ 方 法 的 基本 语法 如 下 所 示 : 


$( 选 择 器 ) 
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在 引号 (可 以 使 用 单 引号 或 者 双 引 号 ， 只 要 前 后 两 端 配对 即 可 ) 之 间 ， 输 入 一 个 或 多 个 
选择 器 ， 接 下 来 就 将 讨论 这 方面 的 内 容 。 

通过 jQuery 选择 器 可 以 找到 页 面 的 文档 对 象 模 型 中 的 一 个 或 多 个 元 素 , 以 便 向 它们 应 
用 各 种 类 型 的 jQuery 方法 。jQuery 的 设计 者 并 没有 开发 出 一 种 新 技术 来 查找 页 面 元 素 ， 而 
是 使 用 与 CSS 选择 器 完全 相同 的 选择 器 。 

1. 通用 选择 器 

与 对 应 的 CSS 选择 器 一 样 ， 通 用 选择 器 使 用 通配符 *， 会 匹配 页 面 中 的 全 部 元 素 。$ 
方法 返回 0 个 或 多 个 元 素 ， 然 后 可 以 使 用 多 种 jQuery 方法 操作 返回 的 这 些 元 素 。 例如， 要 
将 页 面 中 所 有 元 素 的 字体 都 设置 为 Arial， 可 以 使 用 下 面 的 代码 : 


$('*').css('font-family', 'Arial'); 


2. ID 选择 器 


和 对 应 的 Css 选择 器 一 样 ， 这 个 选择 器 通过 元 素 的 ID 来 查找 和 获取 元 素 。 例 如 ， 要 
为 名 为 tabell 的 表格 设置 CSS 类 ， 可 以 使 用 如 下 代码 : 


$('#table1').addClass('myClass'); 


当 这 行 代 码 使 用 addClass 方法 设置 CSS 类 时 ， 将 会 遵循 标准 的 CSS 规则 。 即 需要 通 
过 外 部 CSS 文件 或 者 嵌入 式样 式 表 定义 myClass 类 。 
jQuery 的 $C#tablel1) 和 ASP.NET AJAX 的 $get(table1) 都 会 获得 对 ID 为 tablel 的 一 个 
元 素 的 引用 。 那 么 应 该 选择 哪 一 个 方法 呢 ? 一 般 来 说 ， 当 对 结果 应 用 任意 jQuery 方法 ( 例 
如 css 方法 ) 时 ， 都 应 该 使 用 jQuery 的 $ 方 法 。 而 在 操作 单个 元 素 ， 并 且 想 要 修改 该 元 素 的 
某 个 标准 属性 时 ， 则 可 以 使 用 $get 代替 。 在 这 种 情况 下 ， 也 可 以 使 用 jQuery 的 $， 但 是 因 
为 所 有 的 jQuery 选择 器 都 返回 一 个 对 象 集合 ， 所 以 需要 通过 索引 方式 ， 使 用 [0] 或 get(0) 得 
到 第 一 个 元 素 。 下 面 的 3 个 示例 具有 相同 的 功能 ， 它 们 都 将 Buttonl 的 value 值 设 置 为 
“ 单 击 ”: 
$get('Button1').value = ' 单 击 '; 
$(#Button1)[0].value =' 单 击 '; 
$('#Button1').get(0).value =' 单 击 '; 
3. 元 素 选择 器 


元 素 选择 器 获得 与 特定 的 标记 名 相 匹配 的 0 个 或 多 个 元 素 的 引用 。 例 如 ， 下 面 的 代码 
将 页 面 中 的 所 有 二 级 标题 的 文本 颜色 设置 为 蓝 色 。 


$('h2').css('color', 'blue'); 


4. 类 选择 器 
类 选择 器 获得 与 特定 的 类 名 相 匹配 的 0 个 或 多 个 元 素 的 引用 。 例 如 ， 如 果 有 下 面 的 
HTML 代码 段 : 
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<hl class="Highlight"> 标 题 1</h1> 

<h2> 标 题 2</h2> 

<p class="Highlight"> 如 果 有 一 天 我 不 再 在 乎 你 了 </p> 
<p> 请 记 住 ， 曾 经 也 没 人 听 过 我 的 心事 </p> 


上 述 4 个 元 素 中 有 两 个 元 素 都 有 一 个 名 为 Highlight 的 CSS 类 。 通 过 jQuery 的 类 选择 
器 , 可 以 选择 第 一 个 标题 和 第 一 个 段落 , 然后 将 其 背景 色 修 改 为 红色 , 而 保持 其 他 元 素 不 变 : 


$('.Higehlieht').css('backeround-color', 'red'); 


5. 分 组 与 合并 选择 器 


和 CSS 一 样 ， 可 以 分 组 或 合并 选择 器 。 下 面 的 分 组 选择 器 将 修改 页 面 中 所 有 hl 和 h2 
元 素 的 文本 颜色 为 橙色 : 


$('h1, h2').css('color', 'orange'); 


通过 使 用 合并 选择 器 ， 可 以 找 出 被 其 他 一 些 元 素 包含 着 的 特定 元 素 。 例 如 ， 下 面 的 
jQuery 只 修改 MainContent 元 素 中 包含 的 三 级 标题 ， 而 保持 其 他 的 不 变 : 


$('#MainContent h3').css('color', 'red'); 


6. 层级 选择 


jQuery 支持 4 类 层级 选择 器 ， 分 别 如 下 。 
e ancestor descendant: 在 指定 祖先 元 素 下 匹配 所 有 的 后 代 元 素 ， 与 CSS 中 的 包含 选 
择 器 对 应 。 
è parent> child: 在 给 定 的 父 元 素 下 匹配 所 有 的 子 元 素 ， 与 CSS 中 的 子 选择 器 对 应 。 
o prev +next: 匹配 所 有 紧 接 在 prev 元 素 后 的 next 元 素 , 与 CSS 中 的 相 邻 选择 器 对 应 。 
@ prev~ siblings: 匹配 prev 元 素 之 后 的 所 有 siblings 元 素 。 
例如 ， 有 如 下 代码 : 
<form> 
<label> 姓 名 :</label> 
<input name="name" /> 
<fieldset> 
<label> 个 人 介绍 :</label> 
<input name="newsletter" /> 
</fieldset> 
</form> 


<input name="none" /> 
那么 ， 使 用 层级 选择 器 的 jQuery 代码 如 下 : 


$("form input") // 返 回 结 果 : <input name="name" />, <input name="newsletter" /> 
$("form > input") /返回 结果 : <input name="name" /> 
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$("label + input") /返回 结果 : <input name="name" />, <input name="newsletter" /> 
$("form ~ input") /返回 结果 : <input name="none" > 


7. 使 用 选择 器 


为 了 理解 jQuery 选择 器 以 及 可 以 对 匹配 集 应 用 的 效果 ， 下 面 举例 来 说 明 。 

例 10-2: 使 用 jQuery 选择 器 ， 对 匹配 集 应 用 CSS 样式 或 设置 动画 效果 。 

(1) 启动 VWD2010， 打 开 网 站 Chapter10。 

(2) 通过 “添加 新 项 ”对 话 框 添加 一 个 名 为 Selector.aspx 的 页 面 ， 切 换 到 页 面 的 “ 源 ” 
视图 ， 在 <head> 标 记 中 添加 如 下 代码 引入 jQuery 库 : 


<script sre="Scripts/jquery-1.4.1.min.js" type="text/javascript"></script> 
(3) 在 <form> 标 记 中 添加 如 下 代码 : 


<form id="form1" runat="server"> 

<hl>H1 基本 选择 器 </hl> 

<div> 

<p> 这 里 是 段落 1, 段 落 和 slide 层 都 是 红色 </p> 

<div id="slide">slide 层 ， 下 面 的 段落 2 演示 slideUp 和 slideDown 效果 
<p> 这 里 是 段落 2,</p></div> 

<h2 class="SampleClass"> 类 选择 器 ,5 秒 渐渐 隐藏 </h2> 

</div> 

</form> 

<label id="">Form 后 的 Label, 演 示 层 级 选择 </label> 


(4) 在 上 述 代 码 的 下 面 添 加 如 下 jQuery 代码 : 


<script type="text/javascript"> 
$(function 0 í 
$('*').css('color', 'Green'): 
$('#slide').css('border-bottom', '4px solid black'): 
$('h1').bind('click', function O í alert( 没 有 谁 不 希望 自己 的 爱 能 得 到 回应 ) }); 
$('.SampleClass').hide(5000); 
$('#slide,p').css('color', 'red'); 
$('#slide p').slideUp('slow').slideDown('slow'); 
$("form ~ label").css('color', 'blue'); 
H: 
</script> 
上 述 jQuery 代码 ， 首 先 使 用 通用 选择 器 设置 所 有 文本 的 颜色 为 绿色 ， 设 置 slide 层 的 
下 方 有 一 个 额外 的 边框 线 ， 接 着 为 <h1> 元 素 绑 定 一 个 click 函数 ， 当 单 击 该 元 素 时 ， 将 弹 
出 一 个 对 话 框 ， 然 后 通过 类 选择 器 设置 <h2> 元 素 的 隐藏 效果 。 随 后 又 通过 分 组 选择 器 将 
slide #l p 的 文本 颜色 设置 为 红色 ， 使 用 合并 选择 器 设置 slide 中 的 p 元 素 淡 入 淡出 动画 效 
果 ， 最 后 通过 层级 选择 设置 <form> 元 素 后 面 的 <label> 元 素 的 字体 颜色 为 蓝 色 。 
(5) 编译 并 运行 程序 ， 在 浏览 器 中 打开 Selector.aspx 页 面 。 运 行 效果 如 图 10-3 所 示 。 
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图 10-3 ”使 用 选择 器 页 面 效果 


添加 大 量 动画 会 使 页 面 看 上 去 很 有 趣 。 但 是 一 般 不 推荐 将 所 有 这 些 功能 同时 添加 到 页 
面 中 ,否则 会 吓 跑 大 部 分 用 户 . 但 是 , 本 例 做 为 演示 效果 却 很 好 , 因为 可 以 从 中 看 到 jQuery 
的 一 些 强大 功能 。 

在 本 章 后 面 的 部 分 中 ,将 会 看 到 jQuery 提供 的 更 多 样式 和 动画 方法 。 现 在 只 需要 理解 
选择 器 语法 ， 能 够 在 页 面 中 引用 元 素 即 可 。 


10.2.3 ”筛选 器 


在 jQuery 中 ,可 以 使 用 筛选 器 进一步 过 滤 选 择 器 得 到 的 结果 集 ， 从 而 可 以 找到 特定 的 
元 素 ， 如 第 一 个 元 素 、 最 后 一 个 元 素 、 所 有 奇数 行 元 素 、 所 有 偶数 行 元 素 、 所 有 的 标题 或 
者 特定 位 置 的 项 等 。 


1. 基本 筛选 器 
如 表 10-1 所 示 为 jQuery 的 基本 筛选 器 。 


表 10-1 基本 筛选 器 


i 选 器 用 B 
用 于 选择 匹配 集中 的 第 一 个 和 最 后 一 个 项 。 下 面 的 示例 将 表 的 第 一 行 和 最 后 一 行 的 
背景 色 设置 为 红色 : 
:first $('#Tableld tr:first').css('background-color', 'red'); 
:last $('#TablelId tr:last').css('background-color', 'red'); 


首先 ， 使 用 #Tableld 找到 表 。 然 后 使 用 tr 找到 表 的 全 部 行 。 最 后 ， 使 用 :first 和 :last 
筛选 器 找到 第 一 行 和 最 后 一 行 
用 于 选择 匹配 集中 的 奇数 行 或 者 偶数 行 。 下 面 的 示例 将 表 的 奇数 行 的 背景 色 修 改 为 


:odd 红色 。 因 为 计数 是 从 零 开始 的 ， 所 以 实际 上 将 会 看 到 第 二 行 和 第 四 行 的 背景 色 发 生 
:even 了 改变 (因为 它们 的 索引 分 别 为 1 和 3) 


$('#Tableld tr:odd').css('background-color', 'red'); 
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( 续 表 ) 
m 选 器 用 B 
按照 索引 匹配 元 素 。:eq(equals) 根 据 索引 返回 一 个 元 素 ， 而 :lt(less than) 和 :gt(greater 
:eq(index) than) 则 分 别 返 回 小 于 或 者 大 于 给 定 索 引 的 项 。 示 例如 下 : 
:lt(index) $('#Tableld tr:eq(0)").css('color', 'green");// 修 改 第 一 行 的 颜色 
:gt(index) $('#Tableld tr:gt(2)').css('color', 'green"):// 修 改 大 于 第 二 行 的 文本 颜色 


$(#TableId tr:1t(2)').css('color', 'green");// 修 改行 号 小 于 2 的 行 的 文本 颜色 
找到 页 面 中 的 全 部 标题 (从 hl 到 h6)。 示 例如 下 所 示 : 
$('header').css('color', 'green'); 


:header 


要 了 解 更 多 的 基本 筛选 器 , 可 以 阅读 jQuery 文档 , 网 址 为 http://apijquery.com/category/ 
selectors/。 

2. 高 级 筛选 器 

除了 刚才 看 到 的 基本 筛选 器 以 外 ，jQuery 还 支持 其 他 很 多 筛选 器 ， 它 们 可 以 用 来 根据 
项 包含 的 文本 、 是 否 可 见 ， 以 及 它们 包含 的 任意 属性 获取 项 。 另 外 ， 还 有 一 些 筛 选 器 可 以 
获得 表单 元 素 (例如 按钮 、 复 选 框 和 单 选 按钮 等 )， 以 及 大 量 可 以 用 来 选择 子 元 素 、 父 元 素 、 
兄弟 元 素 和 后 代 元 素 的 选择 器 。 

如 表 10-2 所 示 为 常用 的 高 级 筛选 器 。 


表 10-2 高 级 筛选 器 


i 选 器 用 R 

通过 包含 的 文本 匹配 元 素 。 下 面 的 代码 将 使 表格 中 包含 “小 石头 ”的 单元 格 颜色 为 
绿色 : 
$('td:contains(" 小 石头 ")").css('color', 'green'); 

:contains(text) 
如 果 省 略 td， 那 么 整个 表 都 会 变 成 绿色 。 这 是 因为 表 本 身 也 会 被 匹配 ( 它 的 一 个 子 表 
了 1 含 文 本 “小 石头 ”)， 所 以 颜色 将 应 用 到 整个 表 上 ， 从 而 使 得 每 个 单元 格 的 文本 变 
匹配 至 少 包含 一 个 给 出 元 素 的 元 素 。 示 例如 下 : 

:has(element) 


$(:header:has("span")').css('color', 'green):// 将 包含 span 的 标题 元 素颜 色 修 改 为 绿色 
基于 给 定 属性 匹配 元 素 。 示 例如 下 : 

[attribute] $('[type]').css('color', 'green'); 

需要 在 文本 框 中 输入 一 些 文本 来 查看 绿色 的 字体 

基于 一 个 属性 和 该 属性 的 值 匹配 元 素 。 示 例如 下 : 

$('[type=text]').css('color', 'green'); 


[attribute=value] 
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( 续 表 ) 
i 选 器 用 B 
:Input 
:text 
:password 这 些 选 择 器 可 以 用 来 匹配 特定 的 客户 端 HTML 表单 元 素 。 例 如 ， 可 以 使 用 分 组 选择 
:Tadio 器 把 查找 按钮 和 文本 框 的 代码 段 重 写 如 下 : 
:checkbox $(':button, :text').css('color', 'green'); 
:submit 可 以 使 用 这 些 筛选 器 来 实现 一 些 奇妙 的 效果 。 例 如 ， 要 想 编写 一 些 功能 来 选中 一 个 
:image 表单 中 的 全 部 复 选 框 ， 可 以 使 用 下 面 的 代码 : 
:Teset $(':checkbox').attr('checked', true); 
:button 要 想 取消 选择 全 部 复 选 杠 ， 可 以 传递 false 作为 attr 方法 的 第 二 个 参数 
:hidden 
:file 


下 面 举例 说 明 筛 选 器 的 用 法 。 借 助 于 这 个 页 面 ， 可 以 试验 本 章 中 的 许多 示例 ， 读 者 可 
自行 练习 。 虽 然 这 些 功 能 很 强大 ， 但 是 如 果 不 能 熟练 操作 它们 ， 那 么 它们 也 就 没有 什么 实 
际 价值 。10.2.4 节 将 讨论 如 何 修改 匹配 集中 的 项 的 外 观 和 行为 。 

例 10-3: 使 用 jQuery 筛选 器 。 

(1) 启动 VWD2010， 打 开 网 站 Chapter10。 

(2) 通过 “添加 新 项 ”对 话 框 添加 名 为 Filter.aspx 的 页 面 ， 切 换 到 页 面 的 “ 源 ” 视 图 ， 
在 <head> 标 记 中 添加 如 下 代码 引入 jQuery 库 : 


<script sre="Scripts/jquery-1.4.1.min.js" type="text/javascript"></script> 


(8) 在 <form> 标 记 中 添加 如 下 代码 : 


<div> 
<hl title="First Header"> 一 级 标题 </h1> 
<table id="Tablel"> 
<tr><td> 姓 名 </td><td> 电 话 </td></tr> 
<tr><td> 赵 艳 萌 </td><td>15910806516</td></tr> 
<tr><td> 葛 冰 </td><td>13831705809</td></tr> 
<tr><td> 小 石头 </td><td>03172059240</td></tr> 
<tr><td> 金 百合 </td><td>13293426789</td></tr> 
</table> 
<h2> 二 级 <span style="font-style: italic; font-weight: bold:"> 标 题 </span></h2> 
<br/> 
<input id="Checkbox1" type="checkbox" />80 后 
<input id="Checkbox2" type="checkbox" 人 > 微 博 控 
<input id="Checkbox3" type="checkbox" /> 奥运 
<input id="Checkbox4" type="checkbox" 人 > 娱乐 新 闻 
<input id="Button1" type="button" value=" 全 部 选中 " > 
<input id="Button2" type="button" value=" 全 部 取消 选中 " /> 
</div> 
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(4) 在 <form> 元 素 下 方 ， 添 加 “文档 就 绪 函 数 ”， 代 码 如 下 : 


<script type="text/javascript"> 
$(function 0 í 
$('#Table1").attr('border', '1'); 
$('#Table1").attr('cellpadding', '2'); 
$(#Tablel tr:first').css('background-color', 'red'); 
$(#Tablel tr:odd').css('backeround-color', 'green'); 
$(header').css('color', '#800080'); 
$('-header:has("span")').css('border-bottom-style', 'dashed'); 
$('#Button1').click(function O í 
$(':checkbox").attr('checked', true); 
)); 
$(#Button2').click(function () í 
$(':checkbox').attr('checked', false); 
D 
H: 
</script> 


上 述 代码 都 是 已 经 学 过 的 选择 器 和 筛选 器 的 应 用 ， 请 读者 细 细 体会 。 


(5) 编译 并 运行 程序 ， 在 浏览 器 中 打开 Filter.aspx 页 面 ， 如 图 10-4 所 示 。 单 击 “ 全 前 
选中 ”按钮 ， 可 以 看 到 复 选 框 全 部 被 选中 ， 如 图 10-5 所 示 。 单 击 “ 全 部 取消 选中 ”按钮 将 


取消 所 有 复 选 框 的 选中 状态 。 
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图 10-4 使 用 筛选 器 页 面 效果 


10.2.4 ”对 匹配 集中 的 项 应 用 CSS 
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图 10-5 全 部 选中 复 选 框 效果 


有 了 匹配 集 之 后 ， 就 需要 对 它 执 行 一 些 操作 ， 如 前 面 例子 中 使 用 过 的 css 方法 。 本 节 


将 介绍 如 何 对 匹配 集中 的 项 应 用 CSS 类 或 者 样式 。 


jQuery 以 几 种 不 同 的 方式 支持 CSS。 首 先 ,可 以 使 用 css 方法 来 检索 特定 的 CSS 值 (如 
某 个 项 的 颜色 )， 以 及 设置 一 组 元 素 的 一 个 或 多 个 CSS 属性 。 其 次 ， 使 用 addClass, 
removeClass, toggleClass 和 hasClass 等 方法 可 以 修改 或 检查 对 元 素 应 用 的 CSS 类 。 再 次 ， 
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有 几 种 方法 可 以 用 来 修改 元 素 的 尺寸 和 位 置 。 下 面 介 绍 几 种 常用 的 方法 。 

1. css(name,value) 

这 个 方法 前 面 已 经 用 过 很 多 次 了 , 它 用 来 设置 某 个 匹配 元 素 上 特定 的 CSS 属性 。name 
参数 是 引用 一 个 CSS 属性 的 名 称 (如 border. color 等 )，value 定义 了 要 应 用 的 样式 。 下 面 
的 代码 将 修改 hl 元 素 的 背景 色 为 绿色 : 

$('h1').css('background-color', 'green'); 

2. css(name) 

这 个 方法 基于 传递 给 它 的 属性 检索 特定 的 CSS 值 。 下 面 的 示例 将 弹出 对 话 框 ， 内 容 是 
二 级 标题 中 包含 的 span 元 素 的 font-style 属性 值 。 

alert($('h2 span').css('font-style')); 

可 以 在 jQuery 脚本 中 使 用 这 个 值 ， 例 如 ， 可 以 用 来 在 斜体 和 普通 字体 之 间 切 换 
font-style， 或 者 将 多 个 元 素 设 置 为 相同 的 类 型 。 

3. css(properties) 

这 是 一 个 功能 强大 的 方法 ， 因 为 它 可 以 用 来 同时 设置 匹配 元 素 的 多 个 属性 。 下 面 的 语 
名 将 把 表 中 所 有 单元 格 的 颜色 修改 为 红色 ， 将 它们 的 内 边 距 设置 为 10px， 并 设置 文本 的 字 
体 为 Verdana: 

$('#Tableld td').css({'color' : 'red', 'font-family' : 'Verdana', 
'padding' : '10px'}); 

提示 : 

每 个 属性 和 属性 值 直 接 由 冒号 (:) 分 隔 ， 而 每 个 属性 /属性 值 对 之 间 由 过 号 分 隔 。 完 整 的 
属性 集 包 含 在 一 对 花 括 号 ({}) 之 间 。 


4. addClass、removeClass 和 toggleClass 


addClass 和 removeClass 方法 分 别 用 来 在 元 素 中 添加 和 删除 类 。 与 普通 的 CSS 一 样 ， 
使 用 这 些 方 法 ， 比 使 用 CSS(properties) 方 法 进行 内 联 CSS 赋值 更 好 。 这 样 就 更 容易 在 一 个 
集中 的 位 置 定义 CSS 类 ， 从 而 使 得 它们 更 易于 维护 和 重用 。 

下 面 的 代码 将 为 h2 元 素 添加 新 的 css 类 : 


$('h2').addClass('myClass'); 


如 果 和 希望 再 次 删除 类 ， 则 可 以 调用 removeClass 方法 ， 如 下 所 示 : 
$('h2').removeClass('myClass'); 


如 果 类 还 不 存在 ， 则 toggleClass 方法 将 分 配 一 个 类 ; 否则 ， 将 删除 类 。 
这 3 个 方法 都 允许 传递 多 个 类 ， 各 个 类 之 间 用 空格 分 隔 。 
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结合 使 用 这 些 css 方法 ， 就 在 修改 页 面 元 素 的 外 观 上 拥有 了 极 大 的 控制 权 。 
10.2.5 添加 事件 处 理 


事件 是 许多 编程 语言 中 常用 的 一 种 技术 。 在 前 面 几 章节 中 已 经 看 到 了 .NET 事件 的 应 
用 ，JavaScript 和 DOM 也 不 例外 ， 它 们 在 许多 地 方 都 提供 了 事件 。 例 如 ， 许 多 HTML 元 
素 ( 如 使 用 input type="button" 定 义 的 按钮 ) 都 有 一 个 click 事件 , 在 单 击 的 时 候 触发 。 同样 地 ， 
它们 还 有 onmouseover 和 onmouseout 事件 ， 当 鼠标 经 过 或 者 离开 它们 的 时 候 触 发 。 
即 可 以 在 标记 中 直接 定义 事件 ， 也 可 以 将 事件 处 理 程序 定义 为 一 个 函数 ， 例 如 ， 下 面 
的 两 种 形式 都 是 合法 的 : 
<input type="button" onclick="alert('Hello');" value=" 提 交 " /> 
<input type="button" onclick="SayHello0:" value=" 提 交 " /> 


1. 绑 定 事件 


在 学 习 AJAX 的 时 候 ， 已 经 学 过 ASP.NET AJAX 框架 的 addHandler 方法 ， 可 以 在 一 
个 独立 的 代码 块 中 建立 处 理 程序 。jQuery 则 更 进一步 ， 不 仅仅 允许 将 事件 挂钩 到 单个 元 素 
上 ， 还 允许 将 事件 挂钩 到 整个 匹配 集 上 。 这 种 功能 极为 强大 ， 因 为 只 用 几 行 代码 ， 就 可 以 
将 处 理 程序 绑 定 到 大 量 的 元 素 上 。 例 如 ， 为 了 使 表格 的 外 观 美观 一 些 ， 可 以 设置 当 和 鼠标 移 
动 到 某 行 时 ,该 行 就 改变 颜色 。 如 果 不 使 用 jQuery, 则 需要 对 表 的 每 一 行 都 编写 onmouseover 
和 onmouseout 事件 。 而 使 用 jQuery， 则 只 需 使 用 如 下 几 行 代码 : 
$(functionO í 


$('#Tableld tr') 
.bind(mouseover, function() í $(this).css('backeround-color', 'yellow') }); 


DE 


这 些 代码 将 找 出 #Tableld 元 素 中 的 全 部 表 行 ， 然 后 动态 分 配 一 个 函数 ， 当 鼠标 悬 停 在 
每 一 行 上 时 ， 将 会 调用 该 函数 。 

要 将 onmouseout 绑 定 到 一 个 新 函数 ,只 需 对 bind 的 第 一 次 调用 返回 的 值 再 次 调用 bind 
Bn], jQuery 方法 的 优点 在 于 ， 除 了 应 用 某 些 设计 或 行为 ， 它 们 会 再 次 返回 匹配 集 。 这 样 
就 可 以 对 相同 的 匹配 集 调用 其 他 方法 。 这 个 概念 称 为 链接 (chaining)， 在 这 种 概念 中 ， 使 用 
一 个 方法 的 结果 作为 另外 一 个 方法 的 输入 ， 从 而 产生 一 个 效果 链 。 

$('#Tableld tr') 
.bind('mouseover', function í $(this).css('background-color', 'yellow') }) 
-bind(mouseout', function) í $(this).css('background-color', ") 1): 


提示 : 
上 述 代码 中 结束 行 的 分 号 移动 到 了 最 后 一 行 . 这 样 ， 第 二 个 bind 就 绑 定 到 了 前 一 次 对 
bind 的 调用 上 。 
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上 述 代码 完成 3 项 工作 : 首先 ， 使 用 SC#TableId tr) 找 出 表 中 的 全 部 行 。 它 在 返回 的 匹 
配 集中 调用 bind， 以 便 动态 挂钩 一 些 行为 ， 当 鼠标 移动 到 某 一 行 上 时 ,就 会 触发 这 些 行为 。 
然后 ， 对 第 一 次 调用 bind 返回 的 匹配 集 再 次 调用 bind， 以 便当 鼠标 从 该 行 移 走 的 时 候 重 设 
背景 色 。 代 码 中 将 颜色 设置 为 一 个 空 字符 串 ( )， 以 便 删 除 CSS 背景 属性 ， 这 样 就 可 以 看 
到 原来 的 背景 。 

在 这 个 示例 中 ， 还 有 一 个 重点 地 方 需要 注意 ， 即 设置 背景 色 的 方式 : 


$(this).css('background-color', 'yellow') 


其 中 ，this 关键 字 指 的 是 应 用 该 项 的 元 素 ， 即 在 本 例 中 就 是 表 行 。 使 用 $(this) 将 得 到 
jQuery 匹配 集 (包含 单个 元 素 )， 可 以 对 其 应 用 常规 的 jQuery 方法 ， 如 CSS 方法， 也 可 以 不 
是 以 jQuery 而 是 对 this 元 素 执 行 标准 的 JavaScript 方法 ， 例 如 : 


this.style.backgroundColor = 'yellow' 
说 明 : 
£ JavaScript 中 ， 短 划 线 (-) 不 是 一 个 有 效 的 标识 符 ， 所 有 的 短 划 线 都 将 从 属性 名 中 删 
除 ,而 且 , 原来 紧 跟 在 短 划 线 后 面 的 字母 将 变 为 大 写 方式 . 所 以 , CSS 中 的 background-color 
£ JavaScript 中 就 变 成 了 backgroundColor，font-family 就 变 成 了 fontFamily 等 。 


绑 定 事件 之 后 ， 也 可 以 使 用 unbind([type],[fo]) 方 法 删除 事件 绑 定 。 其 中 ， 第 一 个 参数 
表示 要 删除 绑 定 的 事件 名 ， 第 二 个 参数 表示 删除 的 附带 参数 。 例 如 ， 下 面 示例 将 把 刚 注 册 
的 鼠标 移 走 事件 删除 掉 。 

$('#Tableld tr').unbind('mouseout'): 


另外 ，bind0 方 法 有 一 个 特例 就 是 one(0 方 法 ， 它 能 够 匹配 元 素 绑 定 一 个 仅 能 够 执行 一 
次 的 事件 处 理 函数 。 在 每 个 对 象 上 , 这 个 事件 处 理 函数 只 会 被 执行 一 次 。 其 他 规则 与 bindO 
函数 相同 。 这 个 事件 处 理 函 数 会 接收 到 一 个 事件 对 象 ， 可 以 通过 它 来 阻止 (浏览 器 ) 默 认 的 
行为 。 例 如 : 

$("p").one("click", functionO{ 
alert( $(this).text() ); 
D: 
这 样 ， 当 单 击 一 次 <p> 元 素 后 ， 该 对 象 的 事件 处 理 函 数 会 自动 被 注销 。 
2. 触发 事件 


trigger 表示 开关 的 意思 ，jQuery 定义 trigger0 方 法 用 来 触发 默认 事件 或 自 定 义 事件 。 
例如 ,在 下 面 的 示例 中 自 定 义 了 一 个 事件 myFunc， 把 该 事件 绑 定 到 div 元 素 上 ,然后 定义 
事件 处 理 函数 ， 弹 出 提示 对 话 框 ， 显 示 div 元 素 包含 的 文本 信息 。 
$("div").bind("myFunc", function O í 
alert($(this).textO): 
3); 
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这 个 自 定 义 事件 是 无 法 自动 执行 的 ， 也 不 会 响应 鼠标 或 键盘 行为 。 但 是 可 以 为 它 定义 
一 个 trigger0 方 法 ， 代 码 如 下 : 


$("div").trigger("myFunc"); 


将 上 述 trigger() 方 法 放 在 ready 函数 中 , 当 页 面 加 载 时 就 会 自动 执行 该 自 定 义 事件 函数 。 
也 可 以 把 这 个 自 定义 事件 放 在 另 一 个 事件 函数 中 。 这 样 ， 只 有 触发 其 他 事件 时 ， 才 会 响应 
该 自 定义 事件 ， 并 执行 自 定义 事件 处 理 函 数 。 

$("div").bind("me", function 0 í 
alert($(this).text()); 

y): 

$("div").bind("mouseover",function() í 
$("div").trigger("me"); 

)); 


上 面 脚本 将 在 鼠标 移 过 时 ， 自 动 触发 自 定义 的 事件 处 理 函 数 。 

对 于 默认 事件 ， 如 果 使 用 trigger0 方 法 触发 该 事件 处 理 函数 ， 同 时 默认 事件 自身 也 可 
以 自动 触发 事件 。 例 如 ， 在 下 面 这 个 示例 中 ， 当 鼠标 指针 移 到 p 元 素 上 时 ， 将 触发 绑 定 的 
事件 click， 而 当 单 击 div 元 素 时 ， 也 能 够 触发 该 事件 绑 定 的 处 理 函数 。 


<p> 做 人 的 遗传 比 生理 的 遗传 更 可 怕 </p> 

<div> 没 经 历 过 不 能 体会 其 中 的 伤心 与 无 奈 </div> 

<script language="javascript" type="text/javascript"> 

$("div").bind("click", function O í 
alert($(this).text0); 

HE 

$("p'').bind("mouseover",function() í 
$("div").trigger("click"); 

DE 

</script> 


注意 : 
如 果 希 望 仅 触发 指定 事件 类 型 上 所 有 绑 定 的 处 理 函 数 ， 但 不 执行 默认 事件 ， 则 可 以 使 
用 triggerHandler(type,[data]) 方 法 。 该 方法 与 triggerO 用 法 相同 ， 但 不 会 触发 默认 事件 。 


3. 交互 事件 


为 了 简化 用 户 交 互 操作 ，jQuery 自 定义 了 两 个 事件 : hover(over,out) 和 toggle(fn,fn)。 

hover0 能 够 模仿 悬 停 事件 ， 即 鼠标 移 到 特定 对 象 上 以 及 移出 该 对 象 的 方法 。 它 定义 当 
鼠标 移 到 匹配 的 元 素 上 时 , 会 触发 第 一 个 函数 。 当 鼠标 移出 该 元 素 时 , 会 触发 第 二 个 函数 。 
例如 , 下 面 的 示例 定义 当 鼠 标 移 过 段落 文本 时 会 设置 字体 为 红色 , 而 移 开 时 又 恢复 默认 颜色 。 


<p> 对 方 并 非 你 的 玩具 ， 不 是 你 喜欢 时 就 拿 来 玩 ， 不 喜欢 就 扔 到 角落 去 </p> 
<script language="javascript" type="text/javascript"> 


:304* ASP.NET 4.0 网 站 开发 实例 教程 


$("p").hover( 
function () { 
$(this).css("color", "red"); 
[a 
function O (í 
$(this).css("color", "transparent"); 
b 
及 


</script> 


toggle(fn,fn) 能 够 模仿 鼠标 单 击 事件 ， 它 表示 每 次 单 击 时 切换 要 调用 的 函数 。 如 果 单 击 
了 一 个 匹配 的 元 素 ， 则 触发 指定 第 一 个 函数 ， 当 再 次 单 击 同一 元 素 时 ， 则 触发 指定 第 二 个 
函数 ， 随 后 的 每 次 单 击 都 重复 对 这 两 个 函数 的 轮番 调用 。 例 如 ， 在 上 面 示例 中 ， 将 hoverO 
方法 替换 为 toggle() 方 法 ， 这 样 当 单 击 段落 文本 时 ， 会 自动 在 默认 色 和 红色 之 间 进 行 切换 。 


说 明 : 
对 于 toggle 方法 可 以 使 用 unbind("click") 调 用 进行 删除 。 


10.2.6 访问 jQuery 对 象 


通过 选择 器 或 筛选 器 得 到 的 jQuery 对 象 是 一 个 集合 ,要 访问 该 集合 ,除了 使 用 索引 值 
以 外 ， 还 可 以 使 用 jQuery 定义 的 几 个 方法 和 属性 。 另 外 ，jQuery 还 扩展 并 优化 了 很 多 筛选 
函数 ， 这 些 函 数 作为 jQuery 对 象 的 方法 直接 使 用 ， 从 而 在 选择 器 的 基础 上 更 加 精确 地 控制 
对 象 。 

1. each 方法 


each 方法 迭代 (或 循环 过 历 ) 一 个 集合 。 当 需要 对 匹配 集中 的 项 应 用 某 种 行为 ， 但 是 无 
法 使 用 一 个 jQuery 函数 完成 设置 时 ， 就 可 以 使 用 each 方法 。 把 希望 对 每 一 项 执行 的 函数 
作为 参数 传递 给 each。 例如 ， 下 面 的 each 示例 通过 循环 遍历 匹配 集中 的 每 一 项 ， 然 后 调用 
alert， 将 每 个 单元 格 的 内 容 显示 出 来 。 

$('#Tableld td').each(functionO í 
alert(this innerHTML): 
H: 

2. size() 和 length 

size() 方 法 能 够 返回 jQuery 对 象 中 元 素 的 个 数 ， 而 length 属性 与 size0 方 法 功能 相同 。 
例如 ， 下 面 的 代码 使 用 size0 方 法 和 length 属性 返回 值 都 为 2。 

<span> 丢 了 幸福 的 猪 </span> 


<span> 我 必须 接受 和 容忍 你 的 无 知 </span> 
<script language="Javascript" type="text/javascript"> 
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alert($("span").size0); /返回 值 为 2 
alert($("span").length); /返回 值 为 2 

</script> 

3. get 方法 


get() 方 法 能 够 把 jQuery 对 象 转换 为 DOM 中 的 元 素 集 合 。 例 如 ， 在 下 面 的 示例 中 ， 使 
$0 函数 获取 所 有 span 元 素 ， 然 后 用 get0 方 法 把 该 ]Query 对 象 转换 为 DOM 集合 ， 再 调 
JavaScript 数组 方法 reverse(O 把 数组 元 素 的 位 置 颠倒 过 来 .最 后 为 数组 中 第 一 个 元 素 设置 
字体 为 红色 ， 最 终 效果 是 “<span> 伤 不 起 <span>” 中 的 文本 显示 为 红色 。 


gy 


<span> 爱 情 买 卖 </span><span> 伤 不 起 </span> 

<script language="javascript" type="text/javascript"> 

var spans = $("span"').get().reverse(); // 把 当前 jQuery 对 象 转换 为 DOM 对 象 并 颠倒 它们 的 位 置 
spans[0].style.color = "red"; /把 当前 jQuery 对 象 设置 为 红色 

</script> 


说 明 : 
也 可 以 使 用 get(index) 方 法 获取 指定 索引 值 的 元 素 对 象 。 


4. index 方法 


index 方 法 用 于 获取 jQuery 对 象 中 指定 元 素 的 索引 值 。 如 果 找 到 了 匹配 的 元 素 ,从 0 JF 
始 返回 ， 如 果 没 有 找到 匹配 的 元 素 ， 则 返回 -1。 

如 果 不 给 index() 方 法 传递 参数 , 那么 返回 值 就 是 这 个 jQuery 对 象 集合 中 第 一 个 元 素 相 
对 于 其 同辈 元 素 的 位 置 ， 如 果 参 数 是 一 组 DOM 元 素 或 者 jQuery 对 象 ， 那 么 返回 值 就 是 传 
递 的 元 素 相对 于 原 集合 的 位 置 ， 如 果 参 数 是 一 个 选择 器 ， 那 么 返回 值 就 是 原 元 素 相 对 于 选 
择 器 匹配 元 素 中 的 位 置 。 

例如 ， 在 下 面 的 示例 中 ， 所 有 的 调用 都 返回 1。 


<ul> 

<li id="girl"> 漂 亮 的 姑娘 就 要 媒人 了 </i> 

<liid="miss'> 思 念 是 一 种 很 玄 的 东西 </li> 

<liid="pie"> 千 里 共 婵 娟 </li> 
</ul> 
<script language="Javascript" type="text/javascript"> 
$('li').index(document.getElementById('miss')); /1， 返 回 这 个 对 象 在 原 集合 中 的 索引 位 置 
$('li').index($('#miss')); VW1， 传 递 一 个 jQuery 对 象 
$(li').index($(li:gt(0))); 1， 传递 一 组 jQuery 对 象 ， 返 回 该 对 象 第 一 个 元 素 在 原 集合 中 的 索引 

位 置 

$(#miss').index(1li); /1， 传 递 一 个 选择 器 ， 返 回 #pmiss 在 所 有 二 中 的 做 引 位 置 
$('#miss').index0; /1， 不 传递 参数 ， 返 回 这 个 元 素 在 同辈 中 的 索引 位 置 。 
</script> 


。306 ° ASPNET 4.0 网 站 开发 实例 教程 


5. 筛选 函数 


jQuery 定义 了 很 多 能 够 从 选取 对 象 中 过 滤 部 分 元 素 的 方法 ， 这 些 方法 是 对 选择 器 功能 
的 补充 。 表 10-3 列 出 了 一 些 常用 的 筛选 函数 。 


表 10-3 ”筛选 函数 


筛选 函数 用 ë 
eq(index) 获取 指定 索引 值 位 置 上 的 元 素 ， 索 引 值 从 0 开始 


hasClass(class) 检查 当前 元 素 是 否 含 有 某 个 特定 的 类 ， 如 果 有 ， 则 返回 true 
筛选 与 指定 表达 式 匹配 的 元 素 集合 。 该 方法 用 于 缩小 匹配 范围 , 用 逗号 分 隔 多 个 表 


filter(expr) 达 式 

filter(fn: 筛选 出 与 指定 函数 返回 值 匹配 的 元 素 集合 

. 用 一 个 表达 式 来 检查 当前 选择 的 元 素 集合 , 如 果 其 中 至 少 有 一 个 元 素 符 合 给 定 的 表 
达 式 就 返回 true 

map(callback) 将 一 组 元 素 转换 成 其 他 数组 (不 论 是 否 是 元 素数 组 ) 

not(expr) 删除 与 指定 表达 式 匹 配 的 元 素 


slice(start.[end]) 选取 一 个 匹配 的 子 集 ， 与 原来 的 slice 方法 类 似 
把 与 表达 式 匹配 的 元 素 添加 到 jQuery 对 象 中 。 这 个 函数 可 以 用 于 连接 分 别 与 两 个 
表达 式 匹 配 的 元 素 结果 集 

children([expr 取得 一 个 包含 匹配 的 元 素 集合 中 每 一 个 元 素 的 所 有 子 元 素 的 元 素 集合 
查找 匹配 元 素 内 部 所 有 的 子 节点 (包括 文本 节点 )。 如 果 元 素 是 这 ame， 则 查找 文档 


add(expr) 


contents() 


内 容 
find(expr) 搜索 所 有 与 指定 表达 式 匹 配 的 元 素 。 这 个 函数 是 找 出 正在 处 理 的 元 素 的 后 代 元 素 
next([expr]) 取得 一 个 包含 匹配 的 元 素 集合 中 每 一 个 元 素 紧邻 的 后 面 同辈 元 素 的 元 素 集合 
nextAll([expr 查找 当前 元 素 之 后 的 所 有 元 素 
parent([expr] 取得 一 个 包含 着 所 有 匹配 元 素 的 唯一 父 元 素 的 元 素 集合 
parents([expr]) 取得 一 个 包含 着 所 有 匹配 元 素 的 祖先 元 素 的 元 素 集合 (不 包含 根 元 素 ) 
prev([expr 取得 一 个 包含 匹配 的 元 素 集合 中 每 一 个 元 素 紧邻 的 前 一 个 同辈 元 素 的 元 素 集合 
preVAll([expr 查找 当前 元 素 之 前 所 有 的 同辈 元 素 ， 可 以 用 表达 式 过 滤 
n 取得 一 个 包含 匹配 的 元 素 集合 中 每 一 个 元 素 的 所 有 唯一 同辈 元 素 的 元 素 集合 .可 以 
siblings([expr]) 、 

用 可 选 的 表达 式 进 行 筛选 

加 入 先前 所 选 的 当前 元 素 中 , 对 于 筛选 或 查找 后 的 元 素 , 要 加 入 先前 所 选 元 素 时 将 
andSelf() , 

会 很 有 用 
end0) 回 到 最 近 的 一 个 “破坏 性 ”操作 之 前 ， 即 将 匹配 的 元 素 列 表 变 为 前 一 次 的 状态 


例如 ， 有 如 下 html 代码 : 
<p><span> 早 知道 伤心 总 是 难免 的 </span>, 你 又 何苦 一 往 情 深 </p> 


第 10 章 使 用 jQuery "307。 


那么 ，$Cp").find("span") 的 结果 为 : <span> 早 知道 伤心 总 是 难免 的 </span>。 

例 10-4: 使 用 jQuery 实现 图 片 画 廊 效 果 ， 主 要 利用 jQurey 选择 器 和 筛选 函数 选择 页 
面 元 素 ， 然 后 再 利用 attr0 方 法 读 写 元 素 属性 实现 。 

(1) 启动 VWD 2010， 打 开 网 站 Chapter10。 

O) 在 网 站 跟 目 录 添 加 images 文件 夹 ， 并 在 该 文件 夹 中 添加 5 张 图 片 imagel.jpg~ 
image5.jpg， 这 5 张 图 片 就 是 要 用 来 显示 的 。 

(3) 通过 “添加 新 项 ”对 话 框 新 建 样 式 表 StyleSheet.css， 并 在 该 样式 文件 中 添加 如 下 
样式 定义 : 


body 

(/* 居中 显示 */ 

text-align: center; 

} 

#box 

{ ~ ETA */ 

width: 500px; /* 固定 宽度 */ 

margin: 12px auto; /* 居中 显示 */ 
#largeImg 

{l* 大 图 画 框 样式 */ 

border: solid 1px #FFFF00; /* 定义 边框 */ 
width: 380px; /* 定义 大 图 画 框 的 宽度 */ 
height: 240px; /* 固定 高 度 */ 

padding: 2px; /* 定义 补 白 ， 增 加 一 点 内 边 距 */ 
„thumbs img 

( /* 缩微 图 样式 */ 

border: solid 1px #C0C0C0: /* 边框 样式 */ 
width: 50px; /* 宽度 */ 

height: 50px; /* 高 度 */ 

padding: 4px; /* 增加 补 白 */ 

} 

p 

{ ~ 段落 样式 */ 

padding: 0; /* 清除 段落 补 白 */ 

margin: 6px; /* 清除 段落 边界 */ 

1 


(4) 通过 “添加 新 项 ”对 话 框 , 添加 一 个 名 为 Gallery.aspx 的 页 面 。 切换 到 页 面 的 “ 源 ” 
视图 ， 在 <head> 标 记 中 添加 如 下 代码 引入 jQuery 库 和 CSS 样式 文件 : 


<link href="StyleSheet.css" rel="stylesheet" type="text/css" /> 
<script src="Scripts/jquery-1.4.1.min.js" type="text/javascript" ></script> 


(5) E<fom> pC PRIR, E EREE EA ID 为 box 的 div 内 ， 通 过 
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两 个 p 元 素 分 别 来 组 织 大 图 画 框 和 缩微 图 列表 框 。 代 码 如 下 : 


<div id="box"> 
<h1> 图 片 画廊 </h1> 
<p><img id="largelmg" src—"images/imagel jpg" title=" 圳 天 电影 "alt=" 图 片 无 法 显示 " ></p> 
<p class="thumbs"> 
<a href="images/imagel.jpg" title=" 露 天 电影 "><img src="images/imagel.jpg" /></a> 
<a href="images/image2.jpg" title=" 一 个 人 发 采 "><img src="images/image2.jpg" /></a> 
<a href="images/image3 jpg" title=" 公 交 车 旁 "><img src="images/image3.jpg" /></a> 
<a href="images/image4.jpg" title=" F4 # zx %" ><img src="images/image4.jpg" /></a> 
<a href="images/image5.jpg" title=" 悬 室 的 船 "><img src="images/image5.jpg" /></a> 
</p> 

</div> 


(6) 添加 ready 函数 定义 ， 其 中 定义 了 两 个 函数 : 第 1 个 函数 定义 当 鼠 标 指针 移 过 缩微 
图 时 ， 将 获取 缩微 图 的 地 址 和 提示 属性 信息 ， 并 保存 在 变量 中 。 然 后 把 这 些 信 息 赋值 给 
图 画 框 内 包含 的 ID 为 largeImg 的 <img> 元 素 ， 同 时 设置 缩微 图 的 边框 颜色 ， 以 设计 动态 
效果 ; 第 2 个 函数 定义 在 鼠标 指针 移 开 缩微 图 时 ， 恢 复 缩微 图 的 边框 颜色 。 


<script type="text/javascript"> 
$(function {// 页 面 初始 化 激活 函数 
$(".thumbs a").mouseover(functionO{ // 鼠标 经 过 缩微 图 时 的 处 理 函 数 
var path = $(this).attr("href"); /获取 缩微 图 的 地 址 信息 
var title = $(this).attr("title"); /获取 缩微 图 的 提示 信息 
$(this).children().css("border-color","#FF9900"); V/ 设 置 缩微 图 内 超 链 接 样式 
/把 缩微 图 的 地 址 和 提示 信息 赋予 给 大 图 
$("#largeImg").attr({ src:path,title:title}); 
)); 
$(" thumbs a").mouseout(functionO{ // 鼠标 移 开 缩微 图 时 的 处 理 函数 
$(this).children().css("border-color", "#C0C0C0"); // 恢复 缩微 图 的 默认 边框 颜色 
H: 
H: 
</script> 


(7) 编译 并 运行 程序 ， 在 浏览 器 中 打开 Gallery.aspx， 如 图 10-6 所 示 。 滑 动 鼠标 到 不 同 
的 缩微 图 ， 大 图 将 显示 不 同 的 图 形 ， 如 图 10-7 所 示 。 


ET -| 
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— | 


图 10-6 ”图片 画 廊 初 始 页 面 效 果 图 10-7 滑动 鼠标 显示 不 同 的 缩微 图 
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10.2.7 ”文档 处 理 


可 以 使 用 DOM 为 元 素 节 点 增加 子 元 素 或 文本 节点 , 但 是 DOM 提供 的 方法 比较 烦琐 ， 
需要 先 选 中 对 象 , 再 定义 子 节点 , 最 后 才能 使 用 appendChild(0) 方 法 实现 插入 子 元 素 或 文本 。 
jQuery 提供 的 文档 处 理 方法 要 比 DOM 简单 得 多 ， 且 功能 更 为 强大 和 灵活 。 


4. 


插入 内 容 


jQuery 把 插入 分 为 内 部 插入 和 外 部 插入 两 种 操作 。 
所 谓 内 部 插入 , 就 是 把 内 容 直 接 插 入 到 指定 的 元 素 内 部 。 内 部 部 插入 主要 包含 6 个 方法 。 


append(content): append() 方 法 与 DOM 的 appendChild() 方 法 功能 类 似 ， 都 是 在 元 素 
内 部 增加 子 元 素 或 文本 。 

prepend(content): prepend() 方 法 与 append() 方 法 作用 相同 ， 都 是 把 指定 内 容 插入 到 
jQuery 对 象 元 素 中 ， 但 是 prepend() 方 法 能 够 把 插入 的 内 容 放置 在 最 前 面 ， 而 不 是 
放置 在 最 末尾 。 

appendTo(content): 把 所 有 匹配 的 元 素 追 加 到 另 一 个 指定 的 元 素 或 元 素 集合 中 。 可 
以 将 其 理解 为 append0 方 法 的 反 操作 , 使 用 这 个 方法 是 颠倒 了 常规 的 SCA).append(B) 
的 操作 ， 即 不 是 把 B 追加 到 A 中 ， 而 是 把 A 追加 到 B 中 。 

prependTo(content): 与 appendTo 方法 对 应 ， 该 方法 能 够 把 所 有 匹配 的 元 素 前 置 到 
另 一 个 指定 的 元 素 或 元 素 集合 中 。 

append(function(index, html)): jQuery 1.4 新 增 的 方法 ， 向 每 个 匹配 的 元 素 内 部 追加 
内 容 。 这 个 操作 与 对 指定 的 元 素 执行 appendChild 方法 ， 将 它们 添加 到 文档 中 的 情 
况 类 似 。function 函数 必须 返回 一 个 HTML 字符 串 ,， 用 于 追加 到 每 一 个 匹配 元 素 的 
里 边 。 

prepend(function(index, html)): 与 append(function(index, html)) 对 应 , 也 是 jQuery 1.4 
新 增 的 方法 ， 向 每 个 匹配 的 元 素 内 部 最 前 面 追加 内 容 。 


例如 ， 有 如 下 HTML 代码 : 


<div></div> 

<p> 其 实 你 不 懂 我 的 心 </p> 
<p> 飞 蛾 扑 火 </p> 

<b class="foo"> 我 不 难过 </b> 
<b class="foo"> 等 待 <b> 


那么 ， 有 如 下 jQuery 代码 : 


H 


$("p").append("<b>Hello</b>"); 


果 为 : 


<div></div> 
<p> 其 实 你 不 懂 我 的 心 <b>Hello</b></p> 
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<p> 飞 蛾 扑 火 <b>Hello</b></p> 
<b class="foo"> 我 不 难过 </b> 
<b class="foo"> 等 待 <b> 


如 下 jQuery 代码 : 
$("p").prepend ( $(".foo")[0] ): 
结果 为 : 


<div></div> 

<p><b class="foo"> 我 不 难过 </b> 其 实 你 不 懂 我 的 心 </p> 
<p><b class="foo"> 我 不 难过 </b> 飞 蛾 扑 火 </p> 

<b class="foo"> 我 不 难过 </b> 

<b class="foo"> 等 待 </b> 


如 下 jQuery 代码 : 


$("p").appendTo("div").addClass("test").end().addClass("test2"); 


<div> 

<p class="test test2"> 其 实 你 不 懂 我 的 心 </p> 
<p class="test test2"> 飞 蛾 扑 火 </p> 

</div> 

<p class="test"> 其 实 你 不 懂 我 的 心 </p> 

<p class="test"> 飞 蛾 扑 火 </p> 

<b class="foo test"> 我 不 难过 </b> 

<b class="foo test"> 等 待 </b> 


说 明 : 

appendTo. prependTo insertBefore. insertAfter 和 replaceAll 这 个 几 个 方法 成 为 一 个 “ 破 
坏 性 ”操作 ， 返 回 值 是 所 有 被 追加 的 内 容 ， 而 不 仅仅 是 先前 所 选中 的 元 素 。 所 以 ， 要 选择 
先前 选中 的 元 素 ， 需 要 使 用 end() 方 法 。 


所 谓 外 部 插入 ， 就 是 把 内 容 插入 到 指定 jQuery 对 象 相 邻 元 素 内 。 与 内 部 插入 操作 基本 
类 似 ， 外 部 插入 也 包含 6 个 方法 。 

e after(content): 在 每 个 匹配 的 元 素 之 后 插入 内 容 。 

© before(content): 在 每 个 匹配 的 元 素 之 前 插入 内 容 。 

o insertAfter(contenD: 把 所 有 匹配 的 元 素 插入 到 另 一 个 指定 的 元 素 或 元 素 集合 的 后 面 。 

e insertBefore(content): 把 所 有 匹配 的 元 素 插入 到 另 一 个 指定 的 元 素 或 元 素 集合 的 前 面 。 

e after(function): 在 每 个 匹配 的 元 素 之 后 插入 内 容 。jQuery 1.4 新 增 ， 函 数 必须 返回 
一 个 html 字符 串 。 
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e before(function): 在 每 个 匹配 的 元 素 之 前 插入 内 容 。jQuery 1.4 新 增 ， 函 数 必须 返 


回 一 个 html 字符 串 。 
例如 ， 有 如 下 <div> 元 素 和 <p> 元 素 : 


<p> 我 的 心太 乱 </p><div id="box"> 很 爱 很 爱 你 </div> 


可 以 使 用 如 下 任意 一 条 jQuery 代码 颠倒 两 个 元 素 一 一 <div> 和 <p> 元 素 ， 排 列 顺序 如 下 : 


$("div").after($("p")); 
$("p").before($("#box")[0]); 
$("p").insertAfter($("div")); 
$("div").insertBefore($("p")); 


上 述 4 种 方法 可 以 实现 相同 的 功能 ， 


注意 : 


但 是 它们 的 作用 点 却 各 有 侧重 。 


除了 使 用 jQuery 对 象 作为 插入 内 容 的 参数 外 , 还 可 以 插入 DOM 元 素 或 元 素 集合 ， 以 


及 HTML 结构 字符 串 。 


2. REH 


嵌 套 与 插入 操作 有 几 分 相似 ， 虽 然 它 们 都 可 以 实现 相同 的 操作 目标 
上 还 是 存在 一 些 区 别 。 据 套 重 在 结构 的 构建 ， 而 插入 则 侧重 内 容 的 显示 


下 9 个 嵌 套 结构 的 方法 。 


e wrap(html): 把 所 有 匹配 的 元 素 分 别 用 指定 结构 化 标签 包 右 起 来 


， 但 是 两 者 在 概念 
o jQuery 定义 了 如 


。 这 种 包装 对 于 在 


文档 中 插入 额外 的 结构 化 标记 最 有 用 ， 而 且 它 不 会 破坏 原始 文档 的 语义 品质 。 
e wrap(element): 把 所 有 匹配 的 元 素 分 别 用 指定 元 素 包 庄 起 来 。 
e wrap(function): 把 所 有 匹配 的 元 素 用 其 他 元 素 的 结构 化 标记 包装 起 来 。Function 是 


生成 包 右 结构 的 一 个 函数 。 


è wrapAll(html): 把 所 有 匹配 的 元 素 用 一 个 结构 化 标签 包 计 起 来 。 
© ”wrapAll(element): 把 所 有 匹配 的 元 素 用 一 个 元 素 包 庄 起 来 。 


wrapInner(html): 把 每 一 个 匹配 的 元 素 的 子 内 容 (包括 文本 节点 ) 使 用 一 个 HTML 
wrapInner(element): 把 每 一 个 匹配 的 元 素 的 子 内 容 (包括 文本 节点 ) 使 用 元 素 包 事 起 来 。 
wrapInner(function): 将 每 一 个 匹配 的 元 素 的 子 内 容 (包括 文本 节点 ) 用 DOM 元 素 包 
WEK, Function 是 生成 包 吾 结构 的 一 个 函数 。 

unwrap): 这 个 方法 将 移出 元 素 的 父 元 素 。 这 能 快速 取消 wrap0 方 法 的 效果 。 匹 配 
的 元 素 以 及 他 们 的 同辈 元 素 会 在 DOM 结构 上 替换 他 们 的 父 元 素 。 


例如 ， 对 于 如 下 3 个 超 链 接 文 本 : 


<a hre 全 "~/Imndex.aspx"> 首 页 </a><a hre 仁 "~/Info.aspx"> 概 述 </a><a href="—/About.aspx"> X J 


</a> 
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如 果 希 望 为 每 个 超 链接 包 庄 一 个 <div> 标 签 ， 则 可 以 使 用 如 下 jQuery 代码 : 
$("a").wrap("<div></div>"); 

最 终 显示 效果 的 代码 结构 如 下 : 
<div><a href="~/Index.aspx"> 首 页 </a></div> 


<div><a hre 伍 "~/Info.aspx"> 概 述 </a></div> 
<div><a href="~/About.aspx"> 关 于 </a></div> 


如 果 希 望 利 用 页 面 中 现 有 的 元 素来 包含 超 链接 。 例 如 ， 如 果 希 望 使 用 超 链 接 底 部 的 列 
表 项 元 素来 包 里 超 链接 文本 。 


<a href="~/Index.aspx"> 首 页 </a><a hre 伍 "~/Info.aspx"> 概 述 </a><a href="~/About.aspx">X F 
</a> 

<ul> 

<li> </li> 

</ul> 


可 以 使 用 如 下 jQuery 代码 : 
$("a").wrap(document.getElementsByTagName("li")[0]); 
则 所 得 的 结果 如 下 所 示 : 


<li><a hre 伍 "~/Index.aspx"> 首 页 </a></li> 
<li><a hre 伍 "~/Info.aspx"> 概 述 </a></li> 
<li><a hre 仁 "~/About aspx"> 关 于 </a></i> 
<ul> 

<li> </li> 

</ul> 


如 果 再 为 所 有 列表 项 外 面包 一 层 列表 结构 册 元 素 ， 则 可 以 使 用 如 下 jQuery 代码 : 


$("a").wrap(document.getElementsByTagName("li")[0]): 
$("li").wrapAll(document.getElementsByTagName("ul")[0]); 


所 得 结果 如 下 : 
<ul> 
<li><a href="—/Index.aspx"> 8 B </a></li> 
<li><a hre 伍 "~/Info.aspx"> 概 述 </a></li> 
<li><a hre 伍 "~/About.aspx"> 关 于 </a></li> 
</ul> 
<ul> 
<li> </li> 
<l 


如 果 希 望 为 每 个 列表 项 内 嵌入 一 个 span 元 素 ， 则 可 以 使 用 如 下 jQuery 代码 : 
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$("a").wrap(document.getElementsByTagName("li")[0]); 
$("li").wrapAll(document.getElementsByTagName("ul")[0]); 
$("1i").wrapInner("<span></span>"); 


所 得 结果 如 下 : 


<ul> 
<li><span><a href="~/Index.aspx"> 8 H </a></span></li> 
<li><span><a hre 伟 "~/Info.aspx"> 概 述 </a></span></li> 
<li><span><a href="~/About.aspx"> 关 于 </a></span></li> 
<l 
<ul> 
<li> </li> 
</ul> 
WREAU KUR: 
<div> 
<p> 伤 不 起 </p> 
<p> 因 为 爱情 </p> 
<p> 我 不 难过 </p> 


</div> 

要 移 除 <div> 元 素 ， 则 可 以 使 用 如 下 jQuery 代码 : 
$("p").unwrapO; 

所 得 结果 如 下 : 


<p> 伤 不 起 </p> 
<p> 因 为 爱情 </p> 
<p> 我 不 难过 </p> 


3. 替换 结构 
jQuery 提供 了 replaceWith(content) 和 replaceAll(selecton) 方 法 来 实现 HTML 结构 替换 。 
replaceWith() 能 够 将 所 有 匹配 的 元 素 替 换 成 指定 的 HTML 或 DOM 元 素 。 例 如 ， 对 于 
下 面 3 个 span 元 素 ， 使 用 replaceWithO 把 匹配 的 所 有 span 元 素 及 其 包含 的 文本 都 替换 为 
“<div> 歌 曲 </div>”。 
<span> 天 堂 </span><span> 红 豆 </span><span> 传 奇 </span> 
<script language="javascript" type= "text/javascript"> 
$("span").replaceWith("<div> 歌 曲 </div>"); 

</script> 
最 后 ， 所 得 到 的 效果 如 下 : 

<div> 歌 曲 </div><div> 歌 曲 </div><div> 歌 曲 </div> 


replaceAll(selector) 方 法 与 replaceWith(content) 方 法 操作 正好 相反 。 例 如 ， 要 实现 上 面 
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的 替换 效果 ， 用 replaceAll 方法 就 要 这 样 写 : 
$("<div> 歌 曲 </div>").replaceAll("span"): 
4. 删除 结构 
删除 结构 有 3 种 方法 : empty0、remove([expr]) 和 detach([expr])。 


èe emptyO 
使 用 empty0 可 以 删除 匹配 元 素 包含 的 所 有 子 节点 。 例 如， 在 下 面 示例 中 将 删除 div 元 
素 内 所 有 子 节 点 和 文本 ， 返 回 “<div></div><div></div>” 两 个 空 标签 。 
<div> 美 女 </div> 


<div><p> 为 伊 消 得 人 性 迟 <p></div> 
<script language="Javascript" type="text/javascript"> 
$("div").empty0; 
</script> 
@ remove ([expr]) 
使 用 remove([expr]) 方 法 可 以 删除 匹配 的 元 素 ， 或 者 符合 表达 式 的 匹配 元 素 。 例 如 ， 在 
下 面 示例 中 将 删除 div 元 素 及 其 包含 的 子 节点 ， 最 后 返回 的 是 “<p> 下 雨 收 衣服 </p>”。 
<div> 你 这 不 孝子 </div> 
<div><p> 打 雷 了 </p></div> 
<p> 下 雨 收 衣服 </p> 
<script language="javascript" type="text/javascript"> 
$("div").remove0; 
</script> 
e detach ([expr]) 
使 用 detach ([expr]) 方 法 可 以 从 DOM 中 删除 所 有 匹配 的 元 素 。 这 个 方法 不 会 把 匹配 的 
元 素 从 jQuery 对 象 中 删除 , 因而 可 以 在 将 来 再 使 用 这 些 匹配 的 元 素 。 与 remove0 不 同 的 是 ， 
所 有 绑 定 的 事件 和 附加 的 数据 等 都 会 保留 下 来 。 例 如 ， 在 下 面 示例 中 将 删除 具有 hello 类 
的 <p> 元 素 ， 最 后 返回 的 是 “昆明 湖畔 的 <p> 小 石头 吗 ?</p>”。 
<p class="hello"> 还 记得 </p> 昆明 湖畔 的 <p> 小 石头 吗 ?</p> 
<script language="Javascript" type="text/javascript"> 
$("p").detach(".hello"); 
</script> 


5. 复制 结构 


结构 复制 主要 使 用 clone0 和 clone(true) 方 法 。clone0 表 示 克 隆 匹 配 的 DOM 元 素 并 选 
中 克隆 的 元 素 。 例 如 ， 在 下 面 示例 中 ， 先 使 用 clone() 方 法 克隆 div 元 素 ， 然 后 再 把 它 插入 
到 p 元 素 内 。 
<div > 虚伪 的 家 伙 </div> 
<p> 伪 君子 </p> 
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<script language="Javascript" type="text/javascript"> 
$("div").clone().appendTo("p"); 
</script> 
最 后 插入 结果 为 : 
<div> 虚 伪 的 家 伙 </div> 
<p> 伪 君子 <div> 虚 伪 的 家 伙 </div></p> 
clone(true) 方 法 不 仅 能 够 克隆 元 素 , 而 且 还 可 以 克隆 元 素 所 定义 的 事件 。 例 如， 在 上 面 
示例 中 如 果 为 div 元 素 定义 一 个 onclick 属性 事件 ， 则 使 用 clone(true) 方 法 将 会 在 克隆 元 素 
中 也 包含 属性 事件 。 
<div onclick="alert('Hello World)"> 虚伪 的 家 伙 </div> 
<p> 伪 君子 </p> 
<script language="javascript" type="text/javascript"> 
$("div").clone(true).appendTo("p"); 
</script> 


克隆 的 结果 为 : 
<div onclick="alert(Hello World)"> 虚伪 的 家 伙 </div> 
<p> 伪 君子 <div onclick="alert(Hello World)"> 虚伪 的 家 伙 </div></p> 


10.2.8 使 用 jQuery 的 效果 


在 例 10-2 中 , 使 用 了 slideUp 和 slideDown 来 逐渐 地 隐藏 和 显示 元 素 。 但 是 这 只 是 jQuery 
提供 的 诸多 效果 和 动画 方法 中 的 两 种 方法 。 本 节 将 介绍 其 他 一 些 常用 的 方法 ， 如 表 10-4 所 示 。 


表 10-4 常用 的 动画 效果 方法 


方 ” 法 用 途 
通过 递减 height. width 和 opacity( 使 它们 变 为 透明 ) 隐 藏 或 者 显示 匹配 元 素 。 两 种 方 
howg 法 都 允许 定义 固定 的 速度 ( 慢 、 中 或 快 ) 或 者 一 个 定义 动画 持续 时 间 ( 单 位 为 毫秒 ) 的 数 
sho 
i 字 。 例 如 : 
hide) 
$('h1').hide(1000); 
$('h1').show(1000): 
toggle 方法 在 内 部 使 用 show 和 hide 来 改变 匹配 元 素 的 显示 方式 。 即 可 见 元 素 将 被 隐 
togsle0 藏 ， 不 可 见 元 素 将 会 显示 。 示 例如 下 : 
$('h1').toggle(2000); 
类 似 于 hide 和 show, 这 些 方法 隐藏 或 显示 匹配 元 素 。 但 是 , 这 是 通过 将 元 素 的 height 
pab 从 当前 尺寸 调整 为 0， 或 者 从 0 调整 为 初始 尺寸 来 实现 的 。slideToggle 方法 会 展开 
slideDown 
. 隐藏 的 元 素 ， 卷 起 可 见 的 元 素 ， 从 而 可 以 使 用 一 个 动作 重复 地 显示 和 隐藏 元 素 。 示 
slideUp(O 
: 例如 下 : 
slideToggleO 


$('h1').slideUp(1000).slideDown(1000); 
$('h1').slideToggle(1000); 
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( 续 表 ) 
用 _ ië 


fadeIn) 
fadeOut() 
fadeTo0 


这 些 方法 通过 修改 匹配 元 素 的 不 透明 度 显示 或 隐藏 它们 。 fadeOut 将 不 透明 度 设 置 为 
0, 使 元 素 完全 透明 , 然后 将 CSS display 属性 设置 为 none, 从 而 完全 隐藏 元 素 .fadeTo 
人 允许 指定 一 个 不 透明 度 (0 一 1 之 间 的 一 个 数字 )， 以 便 决 定 元 素 的 透明 程度 。 全 部 3 个 
方法 都 允许 定义 一 个 固定 速度 ( 慢 、 中 、 快 )， 或 者 一 个 定义 了 动画 持续 时 间 ( 单 位 为 
毫秒 ) 的 数字 。 示 例如 下 : 

$('h1').fadeOut(1000); 

$('h1').fadeIn(1000); 

$Ch1').fadeTo(1000, 0.5); 


animate() 


stop) 


delay) 


在 内 部 ，animate 用 于 许多 动画 方法 ， 如 show 和 hide。 但 是 ， 也 可 以 在 外 部 使 用 它 ， 
从 而 可 以 更 灵活 地 以 动画 方式 显示 匹配 元 素 。 例 如 下 面 这 个 示例 : 
$('h1').animate({ 

opacity: 0.4, 

marginLeft: '50px', 

fontSize: '50px' 

}, 1500 ); 

这 段 代码 接受 一 个 hl 元 素 , 将 其 字体 大 小 设置 为 50 像素 , 将 其 不 透明 度 设置 为 0.4 
以 使 元 素 半 透明 ， 并 将 其 左 页 边 距 设置 为 50 像素 ， 从 而 在 1.5 秒 的 时 间 内 平滑 地 进 
行动 画 显示 。animate 方法 的 第 一 个 参数 是 一 个 对 象 ， 它 保存 一 个 或 者 多 个 想 要 动画 
显示 的 属性 ， 每 个 属性 之 间 以 逗号 分 隔 。 注 意 ， 需 要 使 用 JavaScript 的 marginLeft 
和 fontSize， 而 不 是 CSS 的 margin-left 和 font-size 属性 。 只 能 动画 显示 接受 数值 的 
属性 。 也 就 是 说 ， 可 以 使 用 margin、fontSize 和 opacity 等 属性 ， 但 是 不 能 使 用 color 
或 fontFamily 这 样 的 属性 
停止 所 有 在 指定 元 素 上 正在 运行 的 动画 ， 如 果 队 列 中 有 等 待 执行 的 动画 (并 且 第 一 个 
参数 不 是 tme)， 他 们 将 被 马上 执行 
设置 一 个 延 时 来 推迟 执行 队列 中 之 后 的 项 目 。 用 于 将 队列 中 的 函数 延 时 执行 。 他 既 
可 以 推迟 动画 队列 的 执行 , 也 可 以 用 于 自 定义 队列 。 例 如 , 下 面 的 代码 将 在 .slideUpO 
和 .fadeIn0 之 间 延 时 1 秒 : 
$(h1").slideUp(1000).delay(1000).fadeIn(1000); 


下 面 来 看 一 个 jQuery 实现 的 动画 效果 。 

例 10-5: 使 用 jQuery 的 效果 动态 显示 图 片 。 

(1) 启动 VWD 2010， 打 开 网 站 Chapter10。 

(2) 通过 “添加 新 项 ”对 话 框 添加 一 个 名 为 Animate.aspx 的 页 面 ， 切 换 到 页 面 的 “ 源 ” 
视图 ， 在 <head> 标 记 中 添加 如 下 代码 引入 jQuery 库 和 CSS 样式 文件 : 


<link href="StyleSheet.css" rel="stylesheet" type="text/css" /> 
<script src="Scripts/jquery-1.4.1 min Js" type="text/javascript"></script> 
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(3) 本 例 仍然 以 images 文件 夹 中 的 5 个 图 片 文件 为 例 进行 动态 显示 。 在 <form> 标 记 中 
添加 如 下 代码 : 


(4) 
文件 ， 


<div 


id="photoShow"> 

<div class="photo"> 
<img src="images/image1.jpg" /> 
<span> 露 天 电影 </span> 

</div> 

<div class="photo"> 
<img src="images/image2.jpg" /> 
<span> 一 个 人 发 呆 </span> 

</div> 

<div class="photo"> 
<img src="images/image3.jpg" /> 
<span> 公 交 车 旁 </span> 

</div> 

<div class="photo"> 
<img src="images/image4.jpg" /> 
<span> 高 管 云端 </span> 

</div> 

<div class="photo"> 
<img src="images/image5.jpg" /> 
<span> 悬 空 的 船 </span> 

</div> 


</div> 


上 述 代码 用 到 了 一 些 css 样式 ,所 以 需 
添加 如 下 代码 : 


#photoShow 


A 


border: solid 1px #C5E88E; 
overflow: hidden; /#* 图 片 超出 DIV 的 部 分 不 显示 */ 
width: 490px; 
height: 300px; 
background: #C5E88E; 


position: 
) 
-photo 


d 
position: 
top: 0px; 


absolute; 


absolute; 


width: 400px; 
height: 300px; 


j 


添加 这 些 样 式 的 定义 ,打开 StyleSheet.css 
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.photo img 
{ 
width: 400px; 
height: 300px; 
) 
-photo span 
í 
padding: 5px 0px 0px 5px; 
width: 400px; 
height: 30px; 
position: absolute; 
left: 0px; 
bottom: -32px; /* 介 绍 内 容 开 始 的 时 候 不 显示 */ 
background: black; 
color: #FFFFFF; 
)> 


(5) 添加 jQuery 代码 。 在 ready 函数 中 ， 首 先 定 义 了 一 些 变量 ， 然 后 使 用 each0 函 数 
为 每 一 个 匹配 的 元 素 进行 事件 处 理 。 通过 hover() 函数 来 处 理 鼠 标的 hover 事件 。 在 这 里 所 
有 的 动画 效果 都 是 通过 animate0 〇 函数 修改 CSS 属性 ,控制 元 素 的 显示 位 置 来 实现 的 。 代 码 
如 下 : 


<script type="text/javascript"> 
$(document).ready(function () { 
var imgDivs = $("#photoShow>div"); 
var imgNum = imgDivs.length; /图 片 数 量 
var divWid = parseInt($("#photoShow").css("width")); /显示 宽度 
var imgWid = parseInt($(".photo>img").css("width")); /图 片 宽度 
var minWid = (div WWid - imgWid) / (imgNum - 1); /显示 某 一 张 图 片 时 其 他 图 片 的 宽度 
var spanHeight = parseInt($("#photoShow>.photo:first>span").css("height")); /文字 高 度 
imgDivs.each(function (i) í 
$(imgDivs[i]).css({ "z-index": i, "left": i * (divWid / imgNum) }); 
$(imgDivs[i]).hover(function O í 
$(this).find("span").stop().animate( í bottom: 0 }, "slow"); 
imgDivs.each(function (j) í 
if <i) í 
S$(imgDivs[j]).stopO.animate({ left: j * minWid }, "slow"); 
) else í 
$(GmeəgDivs[;]).stopO.animate((left:(J-1)*minWid + 
imgWid},"slow"); 
} 
)): 
}, function Q) í 
imgDivs.each(function (k) í 
$(this).find("span").stop().animate(í bottom: -spanHeight }, "slow"); 
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$(imeDivs[k]).stopO.animate(í left: k * (divWid/imgNum) },"slow"); 
)): 


</script> 


说 明 : 
调用 animate) AAAA stop() 函 数 是 用 来 停止 当前 元 素 的 所 有 执行 中 的 事件 。 


(6) 编译 并 运行 程序 ， 在 浏览 器 中 打开 Animate.aspx 页 面 ， 初 始 状态 如 图 10-8 所 示 。 
当 鼠 标 进入 图 片区 域 后 将 以 大 图 显示 当前 鼠标 所 在 的 图 片 ， 而 其 他 图 片 将 缩小 ， 如 图 10-9 
所 示 。 


http://localhost: i er l0/Aninsto. aspx ~ Vi... 

JO ë aka | x r: 

re ma seo UAW IAV MMY zo mo MV ¿mao IRD MO 
em uu nawai 2-0-00: ki RORA LT -0 


=. s 


x". [> RT | A Qu Te | 
图 10-8 平均 大 小 显示 所 有 图 片 图 10-9 鼠标 进入 图 片区 域 动态 显示 


虽然 一 些 代码 看 上 去 十 分 复杂 ， 但 是 使 用 jQuery 应 用 一 些 特殊 效果 还 是 比较 简单 的 。 
10.3 jQuery 扩展 应 用 


通过 本 章 的 学 习 ， 读 者 已 经 看 到 了 jQuery 的 强大 和 优势 ， 但 是 jQuery 的 功能 还 远 不 
止 如 此 。jQuery 提供 了 一 个 灵活 的 插件 体系 结构 ， 使 得 插件 作者 编写 的 功能 可 以 很 容易 地 
通过 包含 一 个 或 多 个 JavaScript 文件 以 及 调用 一 个 或 者 多 个 方法 进行 重用 。jQuery 社区 积 
极地 开发 出 了 数 百 种 实用 的 插件 ， 可 以 毫 不 费力 地 把 它们 添加 到 页 面 中 。 

jQuery 插件 非常 流行 ，jQuery 站 点 专门 用 了 一 部 分 空间 来 提供 插件 : http://plugins. 
jquery.com/。 除 了 jQuery.com 上 的 插件 存储 库 以 外 ，Internet 上 还 有 其 他 许多 插件 。 

通常 ， 包 含 和 使 用 jQuery 插件 的 步骤 如 下 。 

(1) 在 Intemet 上 找到 并 下 载 要 使 用 的 插件 。 

(2) 在 项 目 中 包含 插件 。 即 将 下 载 的 js 文件 添加 到 Scripts 文件 夹 中 。 

G) 在 页 面 中 添加 对 插件 文件 的 引用 。 如 果 需 要 大 量 使 用 该 插件 ， 则 可 以 把 它 添加 到 
母 版 页 中 。 
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(4) 编写 代码 使 用 插件 。 具 体 的 代码 取决 于 使 用 的 插件 。 一 般 可 以 在 线 找到 插件 的 示 
例 或 readme 文件 。 


10.3.1 使 用 jQuery 插件 


从 jQuery 网 站 或 Internet 网 站 上 下 载 的 插件 通常 都 有 示例 程序 ， 使 用 这 些 插件 都 十 分 
简单 ， 开 发 人 员 不 必 关 心 它 的 工作 原理 ， 只 需 参 照 示 例 使 用 插件 ， 执 行 代码 即 可 实现 相应 
的 效果 。 下 面 将 介绍 水 印 效果 的 jQuery 插件 的 使 用 ,可 以 在 http://plugins.jquery.com/project/ 
updnWatermark 上 找到 该 插件 。 

例 10-6: 使 用 水 印 效果 jQuery 插件 。 

(1) 启动 VWD 2010， 打 开 网 站 Chapter10。 

(2) 将 下 载 的 jQuery 插件 解压 ， 将 得 到 的 jquery.updnWatermark.js 文件 添加 到 项 目的 
Scripts 文件 夹 中 ， 将 Sample.css 文件 添加 到 项 目 跟 目录 中 。 

(3) 通过 “添加 新 项 ”对 话 框 添加 名 为 Watermark.aspx 的 页 面 ， 切 换 到 页 面 的 “ 源 ” 
视图 ， 在 <head> 标 记 中 添加 如 下 代码 引入 jQuery 库 和 CSS 样式 文件 : 

<script sre="Scripts/jquery-1.4.1.min.js" type="text/javascript"></script> 
<script sre="Scripts/jquery.updnWatermark.js" type="text/javascript"></script> 
<link type="text/css" rel="Stylesheet" href="Sample.css" /> 


(4) 添加 一 个 TextBox 控件 到 页 面 中 ， 要 想 使 插件 将 水 印 文 本 添加 到 文本 框 中 ， 需 要 
设置 想 添加 水 印 的 每 个 控件 的 ToolTip 属性 。 标 记 中 的 ToolTip 属性 将 映射 到 最 终 HTML 
中 的 title 属性 .设置 TextBox 控件 的 ToolTip 属 性 ,并 在 控件 钱 添 加 一 些 提示 性 文本 , <form> 
标记 中 的 代码 如 下 : 

<div> 
<h2>updnWatermark 使 用 示例 </h2> 
姓名 : <asp:TextBox ID="TextBoxl" runat="server" ToolTip=" 输 入 姓名 ， 如 葛 萌 萌 


"></asp:TextBox> 
</div> 


(5) 接 下 来 就 是 在 文档 就 绪 函 数 中 调用 插件 的 主 方法 ， 设 置 控件 的 水 印 效果 。 当 输入 
$. 时 将 弹出 “智能 提示 ”窗口 ， 在 提示 的 可 用 方法 列表 中 可 以 看 到 updnWatermark， 如 图 
10-10 所 示 。 
(6) 可 以 参照 下 载 的 插件 的 示例 代码 ， 添 加 如 下 代码 : 


<script type="text/javascript"> 
$(function O í 
$updnWatermark attachAll0O: 
D: 
</script> 
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说 明 : 

不 需要 选择 任何 项 。 只 需要 调用 jQuery 对 象 的 updnWatermark 方法 (使 用 $ 快 捷 方 式 )， 
而 不 必 指定 任何 选择 器 。 然 后 updnWatermark 方法 将 扫描 表单 ， 查 找 具 有 title 属性 的 表单 
字段 。 也 可 以 选择 传 入 一 个 定义 了 文本 标记 的 CSS £. 


(7) 编译 并 运行 程序 ， 运 行 效果 如 图 10-11 所 示 。 将 光标 聚焦 到 文本 框 控件 上 时 ， 水 


印 文本 将 会 消失 。 不 在 控件 中 输入 值 并 失去 焦点 时 ， 文 本 将 会 重新 显示 。 

Æ http://1ocalhost:1085/Chapter10/Yat... |- (DES 

r en > Gd SIA TERTE aaa Tl 
i XPD RED FEV wQ) IAV HHW 

Kaceipty San ARER Ø http://localhost: 10... A-D g 

updnWatermark 使 用 示例 

姓名 | 输入 姓名 ,如 Sg 

@ Internet far Rios ~ 

图 10-10 代码 的 智能 提示 图 10-11 水 印 效果 


这 个 水 印 插件 非常 智能 ， 它 并 不 会 把 文本 放 到 文本 框 中 。 相 反 ， 它 会 快速 创建 一 个 标 
记 ， 并 将 其 放 到 文本 框 上 ， 从 而 使 文本 看 上 去 包含 在 文本 框 中 。 这 个 解决 方案 的 智能 之 处 
在 于 ， 因 为 实际 的 字段 没有 改变 ， 所 以 控件 的 验证 仍然 与 以 前 一 样 。 验 证 控件 时 会 看 到 一 
个 空 文本 杠 ， 如 果 没 有 输入 有 效 数据 ， 但 是 却 想 提 交 表 单 ， 验 证 控件 就 会 触发 一 个 验证 弹 
出 窗口 。 
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本 节 将 通过 一 个 简单 的 例子 来 介绍 如 何 编写 jQuery 插件 ， 要 编写 的 这 个 jQuery 插件 
很 简单 ， 实 现 的 功能 是 给 指定 表格 加 上 鼠标 所 在 行 高 亮 显示 。 
1. 编写 插件 


例 10-7: 编写 一 个 给 指定 表格 加 上 鼠标 所 在 行 高 亮 显示 的 jQuery 插件 ,并 提供 测试 页 面 。 
(1) 启动 VWD 2010， 打 开 网 站 Chapter10。 

(2) 在 Scripts 文件 夹 中 通过 “添加 新 项 ”命令 添加 一 个 JScript 文件 jQuery.tabHighLightjs。 
(3) 在 新 建 的 文件 中 添加 如 下 代码 : 


(function ($) { 
$.fn.lightRow = function (row_color) í 
var default_color = "#669900"; 。”// 默 认 颜 色 
row_color = (Tow_color == undefined) ? default_color : row_color; 
$(this).find("tr").each(function O í 
$(this).mouseover(function () í 
$(this).attr("old color", $(this).css("background-color")); V/ 创 建 属性 保存 旧 颜色 
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$(this).css("background-color", row_color); /使 用 新 颜色 
})-mouseout(function () í 

$(this).css("background-color", $(this).attr("old color"): V 恢 复 旧 颜色 

$(this)removeAttr("old color"): /删除 保存 旧 颜 色 的 属性 


DE 
DE 
return $(this); /保持 操作 链 
} 
DOQuery); 


上 述 代码 的 核心 部 分 与 例 10-3 中 的 jQuery 代码 类 似 ， 都 是 添加 了 鼠标 的 进入 和 移出 
事件 ， 所 不 同 的 是 头 和 尾 的 格式 。 头 部 定义 了 方法 的 调用 方式 ， 方 法 名 是 lightRow 并 且 可 
以 有 一 个 可 选 参数 指定 颜色 ， 尾 部 定义 了 方法 返回 值 ， 返 回 原 调 用 对 象 ， 并 在 最 末尾 用 
(Query) 标 识 这 是 一 个 jQuery 插件 。 

2. 测试 插件 

例 10-8: 添加 一 个 测试 页 面 ， 引 入 例 10-7 中 创建 的 jQuery 插件 ， 并 测试 插件 效果 。 

(1) 启动 VWD 2010， 打 开 网 站 Chapter10。 

(2) 通过 “添加 新 项 ”命令 ， 添 加 一 个 名 为 的 TestMyjQuery.aspx 页 面 。 

(3) 切换 到 页 面 的 “ 源 ” 视 图 ， 在 <head> 标 记 中 添加 如 下 代码 引入 jQuery 库 : 

<script sre="Scripts/jquery-1.4.1.min.js" type="text/javascript"></script> 
<script sre="Scripts/jQuery.tabHighLight.js" type="text/javascript"></script> 


(4) 在 页 面 的 <div> 元 素 中 添加 一 个 表格 ， 代 码 如 下 : 


<table id="Table1"> 
<tr><td> 姓 名 </td><td> 电 话 </td></tr> 
<tr><td> 赵 艳 萌 </td><td>15910806516</td></tr> 
<tr><td> 葛 冰 </td><td>13831705809</td></tr> 
<tr><td> 小 石头 </td><td>03172059240</td></tr> 
<tr><td> 金 百合 </td><td>13293426789</td></tr> 
</table> 


(5) 接 下 来 就 是 在 文档 就 绪 函 数 中 调用 插件 的 方法 ， 设 置 高 亮 显示 鼠标 经 过 行 ， 代 码 
如 下 : 


<script type="text/javascript"> 
$(function O í 
$(#Table1")attr( (border: '1', cellpadding: '2'.cellspacing: '2'}); 
$('#Table1').lightRow('yellow'); 
H: 
</script> 


(6) 编译 并 运行 程序 ， 运 行 效果 如 图 10-12 所 示 。 
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mn | 
Æ http://localhost: 1085/Chapter10/TestEy. -- = Ë 
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= 
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赵 艳 戎 15910806516 
Byk [13831705809 
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@ Internet fa~ Riog ~ 


B 10-12 ”测试 自己 编写 的 jQuery 插件 


10.3.3 jQuery 对 Ajax 的 支持 


本 节 将 介绍 jQuery 对 Ajax 的 支持 , jQuery 封装 了 XMLHttpRequest 组 件 并 初始 化 , 还 
封装 了 Ajax 请 求 中 的 各 种 基本 操作 ， 并 把 这 些 操作 定义 为 简单 的 方法 。 另 外 ， 它 把 Ajax 
请 求 中 各 种 状态 封装 为 事件 ， 这 样 只 要 调用 对 应 的 事件 就 可 以 快速 执行 绑 定 的 回调 函数 。 
1. Ajax 请 求 
jQuery 封装 了 多 种 方法 实现 与 远程 进行 通信 ， 主 要 有 如 下 几 个 。 
e load(url,[data],[callback]): load() 方 法 能 够 载 入 远程 HTML 文件 代码 并 插入 到 匹配 
元 素 中 。 默 认 使 用 GET 方式 ， 传 递 附 加 参数 时 自动 转换 为 POST 方式 。 

© jQuery.get(url,[data],[callback]): jQuery.get(O 方 法 能 够 通过 远程 HTTP GET 方式 请 求 
载 入 信息 。 该 方法 包含 3 个 参数 ， 参 数 含义 与 load() 方 法 相同 。 

® jQuery.post(url,[data],[callback]): jQuery.postO 与 jQuery.getO 的 操作 方法 相同 ， 所 
不 同 点 是 它们 传递 参数 的 方式 不 同 。jQuery.postO 是 以 POST 方式 来 传递 参数 ， 所 
传递 的 信息 可 以 不 受 限 制 ， 且 可 以 传递 二 进 制 信息 。 

例 10-9: Ajax 请 求 示 例 。 

(1) 启动 VWD 2010， 打 开 网 站 Chapter10。 

(2) 通过 “添加 新 项 ”对 话 框 添加 一 个 html 文件 testhtm， 在 页 面 的 <body> 元 素 中 添 
加 如 下 代码 : 

<body> 

<h2> 这 是 通过 load 方法 加 载 的 信息 </h2> 

<p> 对 于 梦 入 谊 育 的 人 来 说 ， 揭 穿 他 的 梦 是 残忍 的 </p> 
</body>> 


(3) 通过 “添加 新 项 ”对 话 框 添加 一 个 名 为 AjaxTest.aspx 的 页 面 ， 在 页 面 的 <head> 标 
记 中 添加 如 下 代码 引入 jQuery 库 : 


<script src="Scripts/jquery-1.4.1.min.js" type="text/javascript"></script> 
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(4) 在 AjaxTestaspx 页 面 的 <form> 标 记 中 添加 如 下 代码 : 


<div id="myDiv"></div> 

姓名 : <input id="Textl" type="text" /><br > 

职业 : <input id="Text2" type="text" /><br > 

<input id="Button1" type="button" value=" Ajax Get" /> 
<input id="Button2" type="button" value=" Ajax Post" /> 


(5) 通过 “添加 新 项 ?对 话 框 ,添加 另外 两 个 Web 窗 体 , 名称 分 别 为 getaspx 和 post.aspx。 
(6) 返回 AjaxTestaspx 页 面 ， 添 加 如 下 jQuery 代码 : 


<script type= "text/javascript"> 
$('#myDiv').load("test.htm"); 
$(#Button1').bind('click', function O í 
$.get("get.aspx", { name: $('#Text1")[0].value, job: $('#Text2')[0].value }, 
function (msg) { 
alert(msg); 
b 
这 
ge 
$('#Button2').bind('click', function O í 
$ post("post.aspx", { name: $('#Text1')[0].value, job: $('#Text2')[0].value }, 
function (msg) í 
alert(msg); 
); 
D: 
</script> 
上 述 代码 中 ,load() 方 法 能 够 载 入 远程 HIML 文件 并 插入 到 匹配 元 素 中 。 默 认 使 用 GET 
方式 ， 传 递 附加 参数 时 自动 转换 为 POST 方式 。jQuery 会 自动 从 text.htm 文档 中 提取 body 
元 素 包含 的 代码 ， 并 把 这 些 代码 插入 到 匹配 的 id 为 myDiv 的 <div> 元 素 中 。 
然后 ， 为 两 个 按钮 绑 定 事件 处 理 程序 ， 分 别 调 用 get 和 post 方法 发 送 请 求 ， 并 向 服务 
器 传递 参数 ， 服 务 器 响应 之 后 会 把 返回 值 存储 在 回调 函数 参数 中 ， 弹 出 消息 提示 框 ， 这 两 
个 按钮 提交 请 求 的 方式 虽然 不 同 ， 但 实现 的 功能 是 相同 的 。 
(7) 在 get.aspx 页 面 中 ， 删 除 除 Page 指令 外 的 其 他 代码 ， 添 加 如 下 代码 : 


<% 
string str= "通过 GET 方式 请 求 m 姓名 : "+ Request.QueryString["name"]+ "n 职业 : "+ 
Request.QueryString["job"]; 
Response. AddHeader("ContentType", "text/html;charset=utf8"); 
Response. Write(str); 
%> 


(8) 类 似 地 ， 在 postaspx 页 面 中 ， 也 删除 除 Page 指令 外 的 代码 ， 添 加 下 面 的 代码 : 
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<% 
string str = "通过 POST 方式 请 求 m 姓名 : "+ RequestForm["name"] + "n 职业 : "+ 
RequestForm["job"]; 
Response.AddHeader("ContentType", "text/html;charset=utf8"); 
Response.Write(str); 
%> 


(9) 编译 并 运行 程序 ， 在 浏览 器 中 打开 AjaxTest.aspx 页 面 ， 如 图 10-13 所 示 ， 在 文本 
框 中 输入 姓名 和 职业 后 ， j 


wap: //1ocalhost: 1088/Chapter 10/42: -- [= [PUEJ w TIT Jog) 
> [es /caort 四 OO Be Anien Z 习 
XPD WY FEV KERO IAV 帮助 op E T. 
ARR | hnup /nocaast: 10. a-a ” ARREK — @wao /Aosadkest'0 |a- "| 
这 是 通过 load 方 法 加 载 的 信息 这 是 通过 load 方 法 加 载 的 信息 
对 于 梦 入 育 育 的 人 来 说 ， 揭 穿 他 的 梦 是 残忍 的 对 于 梦 入 育 言 的 人 来 说 ， 揭 穿 作 的 梦 是 残 避 的 Š 
- 来自 网页 的 消息 “加 
姓名 ， 
职业 ， ER 
EE talan 
E a Re) 
图 10-13 页面 运行 效果 图 10-14 Ajax 调用 结果 显示 
注意 : 


在 使 用 load() 方 法 时 ， 所 有 页 面 的 字符 编码 应 该 设置 为 utf8， 否 则 jQuery 在 加 载 文档 
时 会 显示 乱码 。 另 外 ， 匹 配 的 元 素 应 该 只 有 一 个 ， 否 则 系统 会 出 现 异 常 。 


2. jQuery.ajax() 请 求 

jQuery.ajax(options) 方 法 与 前 面 几 个 方法 功能 相同 ， 都 是 向 服务 器 端 发 送 请 求 ， 并 传递 
参数 ， 最 后 调用 回调 函数 获取 响应 信息 。 

jQuery.ajax() 方 法 的 参数 是 一 个 对 象 包含 的 参数 名 / 值 对 组 合 ， 其 中 主要 参数 名 如 表 
10-5 所 示 。 
R 10-5 ”jQuery.ajax() 方 法 的 主要 参数 说 明 
参 数 名 说 M 
逻辑 值 ， 默 认为 ttue， 即 请 求 为 异步 请 求 。 如 果 需 要 发 送 同步 请 求 ， 可 将 其 设置 为 


i false。 同 步 请 求 将 锁 住 浏览 器 ， 用 户 的 其 他 操作 必须 等 待 请 求 完成 才 可 以 执行 
beforeSend 发 送 请 求 前 可 修改 XMLHttpRequest 对 象 的 函数 

cache 是 否 从 浏览 器 缓存 中 加 载 请 求 信息 ， 默 认为 false 

complete 请 求 完成 后 回调 函数 ， 不 管 请 求 是 成 功 还 是 失败 均 调用 


contentType 发 送信 息 到 服务 器 时 内 容 编码 类 型 ， 默 认为 适合 大 多 数 应 用 场合 

发 送 到 服务 器 的 数据 将 自动 转换 为 请 求 字符 串 格式 。GET 请 求 中 将 附加 在 URL 后 。 
如 果 processData 选项 禁止 此 自动 转换 ， 必 须 为 名 / 值 对 格式 。 如 果 为 数组 ，jQuery 
将 自动 为 不 同 值 对 应 同一 个 名 称 ， 如 : 
{foo:["bar1","bar2"]} 转 换 为 '&foo=barl&foo=bar2' 


data 
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参 数 名 说 A 
dataType 预期 服务 器 返回 的 数据 类 型 。 取 值 包括 xml, html, script, json 和 jsonp 
error 请 求 失败 时 调用 函数 
global 是 否 触发 全 局 Ajax 事件 ， 默 认为 tme 
ifModified 是 否 仅 在 服务 器 数据 改变 时 获取 新 数据 ， 默 认为 false 
processData 发 送 的 数据 是 否 可 以 被 转换 为 对 象 ， 默 认为 true 
success 请 求 成 功 后 回调 函数 ， 参 数 为 服务 器 返回 数据 
timeout 请 求 超时 时 间 ( 单 位 为 毫秒 ) 
type 请 求 的 方式 ， 默 认为 GET， 取 值 包 含 POST、GET、PUT 和 DELETE 
url 发 送 请 求 的 地 址 


例 10-9 中 两 个 按钮 的 绑 定 事件 也 可 以 使 用 如 下 jQuery.ajax0 请 求实 现 : 


$('#Button1').bind('click', function O í 
var str = "name=" + $('#Text1')[0].value + "&job=" + $('#Text2')[0].value; 
$.ajax({ url: "get.aspx", 
type: "GET", 
data: str, 


H: 


success: function (msg) { 
alert(msg); 

} 

D: 


$('#Button2').bind('click', function | í 
var str = "name=" + $('#Text1')[0].value + "&job=" + $('#Text2')[0].value; 
$.ajax({ url: "post.aspx", 


H: 
D 


type: "POST", 

data: str, 

success: function (msg) { 
alert(msg); 


读者 可 自行 上 机 试验 ， 查 看 结果 是 否 正确 。 


3. Ajax 事件 
除了 Ajax 请 求 所 使 


的 方法 以 外 ，jQuery 为 了 方便 用 户 灵 活 跟 踪 Ajax 请 求 和 响应 整 


个 完整 的 过 程 ， 还 定义 了 几 个 事件 函数 ， 如 表 10-6 所 示 。 
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表 10-6_Ajax 事件 函数 


Ajax 事件 说 AA 
ajaxStart(callback) Ajax 请 求 开 始 时 执行 函数 
ajaxSend(callback) Ajax 请 求 发 送 前 执行 函数 


Ajax 请 求 完成 时 执行 函数 
Ajax 请 求 成 功 时 执行 函数 


ajaxComplete(callback 


ajaxSuccess(callback) 


ajaxError(callback) Ajax 请 求 发 生 错误 时 执行 函数 
ajaxStop(callback) Ajax 请 求 结束 时 执行 函数 


例 10-10: 通过 Ajax 事件 ， 跟 踪 Ajax 请 求 的 全 部 过 程 。 

(1) 启动 VWD 2010， 打 开 网 站 Chapter10。 

(2) 通过 “添加 新 项 ”对 话 框 添加 一 个 名 为 AjaxEvent.aspx 的 页 面 ， 在 页 面 的 <head> 
标记 中 添加 如 下 代码 引入 jQuery 库 : 


<script Src="Scripts/jquery-1.4.1.min.js" type="text/javascript"></script> 


(3) 在 AjaxEvent.aspx 页 面 的 <form> 标 记 中 添加 与 AjaxTest.aspx 类 似 的 代码 : 


<h2> 演 示 Ajax 事件 </h2><p></p> 

姓名 : <input id="Textl" type="text" /><br > 
职业 : <input id="Text2" type="text" /><br /> 
<input id="Button1" type="button" value=" 提 交 " /> 


(4) 在 <form> 标 记 下 方 添加 如 下 jQuery 代码 : 


<script type="text/javascript"> 

$('#Button1').bind('click', function O í 
$ get("get.aspx", { name: $('#Text1%)[0].value, job: $('#Text2”)[0] value }, 
function (msg) í 

alert(msg); 

} 

jE 

$('#Button1').ajaxStart(function O í 
$("p').append("Ajax 请 求 开始 <br>"); 

)): 

$('#Button1').ajaxSend(function () í 
$("p").append("Ajax 请 求 开 始 发 送 <br>"); 

D: 

$('#Button1').ajaxComplete(function () í 
$("p").append("Ajax 请 求 完 成 <br>"); 

J): 

$('#Button1').ajaxSuccess(function () í 
$("p").append("Ajax 请 求 成 功 <br>"); 

D: 


</script> 
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(5) 编译 并 运行 程序 ， 在 浏览 器 中 打开 AjaxEventaspx 页 面 ， 此 时 还 没有 Ajax 事件 触 
发 ， 所 以 <p> 标 记 中 没有 显示 任何 信息 ， 如 图 10-15 所 示 。 

(6) 在 文本 框 中 输入 姓名 和 城市 后 ， 单 击 “ 提 交 ” 按 钮 ， 将 弹出 提示 对 话 框 ， 此 时 触 
发 了 ajaxStart 和 ajaxSend 事件 ， 如 图 10-16 所 示 。 


p: 

SO [E] stts ¿localhost r06S/Chapterl0/AjseEvent aspx [ae] 

XD MO FEV BRAW IAV WHW 

ARER Ø http://localhost:10... | R - 9 i E 

一 j 演示 Ajax 事件 

演示 Ajax 事件 Ajax 请求 开始 
Ajax 请 求 开始 发 送 

PE 一 B£, RER 
职业 ， 理 发 师 

Internet far Rios ~ @ interet far Rios > 
图 10-15 页面 初始 效果 图 10-16 触发 了 ajaxStart 和 ajaxSend 事件 


(7) 单 击 “ 确 定 ” 按 钮 ， 关 闭 提示 对 话 框 ， 此 时 触发 了 ajaxSuccess 和 ajaxComplete 事 
件 ， 如 网 10-17 所 示 。 


p: //1oc; st: er maiii 


gO- B Localhost ;x 加] 
XO RAO SEV (wQ) IAD MPO 
ABER — Qe htep://Localhost:10. m - 


演示 Ajax 事件 


Ajax 请 求 开始 

Ajax 请 求 开始 发 送 

Ajax 请 求 成 功 

Ajax 请 求 完成 

姓名 ，| 小 石头 

职业 ， 美 发 师 

回 


@ Internet fà- Rios ~ 


xl 


D 


图 10-17 触发 了 ajaxSuccess 和 ajaxComplete 事件 


10.4 ”本章 小 结 


本 章 介 绍 了 jQuery， 这 是 一 种 非常 流行 的 开源 客户 端 JavaScript 框架 ， 可 以 用 来 与 文 
档 对 象 模型 进行 交互 。 首 先 介 绍 了 jQuery 的 特点 以 及 在 Web 站 点 中 引入 jQuery 的 方法 。 
然后 介绍 了 jQuery 的 基本 语法 ， 包 括 在 页 面 中 查找 相关 元 素 的 jQuery 选择 器 和 筛选 器 、 
对 匹配 集 应 用 CSS 和 动画 效果 、 添 加 事件 处 理 、 访 问 通过 选择 器 和 筛选 器 得 到 的 jQuery 
对 象 以 及 对 jQuery 对 文档 的 处 理 方 法 。 在 本 章 的 最 后 ， 介 绍 了 jQuery 的 扩展 应 用 ， 包 括 
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下 载 和 使 用 jQuery 插件 ， 自 己 编写 插件 ， 以 及 jQuery 对 Ajax 的 支持 等 内 容 。 
jQuery 是 一 个 功能 强大 的 工具 ， 通 过 本 章 的 学 习 ， 读 者 应 掌握 jQuery 的 基本 语法 ， 能 
够 通过 jQuery 简化 传统 的 JavaScript 代码 ， 为 自己 的 网 站 开发 带 来 便利 。 


10.5 思考 和 练习 


1. 在 jQuery 中 ， 使 用 什么 作为 在 页 面 中 查找 元 素 的 快捷 方式 ? 
2. 所 有 的 jQuery 选择 器 都 返回 什么 ? 

3. jQuery 的 层级 选择 器 有 哪些 ? 分 别 有 什 么 功能 。 
4.bind() 方 法 和 one0 方 法 有 什么 不 同 之 处 ? 

5. size() 和 length 有 何 异 同 点 ? 

6. 有 如 下 <div> 元 素 和 <p> 元 素 : 


<p> 卑 微 的 爱 </p><div id="box"> 不 如 高 傲 的 离开 </div> 


如 何 使 用 jQuery 代码 颠倒 两 个 元 素 的 排列 顺序 。 

7. slideUp 和 slideDown 有 什么 区 别 ? 两 种 方法 都 接受 什么 重要 参数 ? 

8. jQuery.get() 方 法 与 jQuery.post0 方 法 有 何 区 别 ? 

9. 在 使 用 10ad0 方 法 时 ， 所 有 页 面 的 字符 编码 应 该 设置 为 什么 方式 ? 

10. 上 机 练习 ， 使 用 jQuery 实现 超 链接 文件 类 型 标识 图 标 ， 对 于 指向 不 同文 件 类 型 的 
超 链接 显示 不 同 的 标识 图 标 ， 如 图 10-18 所 示 。 


gt Ezrrtë mart 
Butt 国 SI 文 件 国 JP6 文 件 
omre onte ciami 
httpi//ww. css8. cn/ E http://w, cas8. cn 


图 10-18 ” 超 链 接 文件 类 型 标识 图 标 


11. 下 载 jQuery 插件 ， 根 据 示例 文件 ， 自 己 编写 测试 页 面 ， 使 用 插件 并 查看 效果 。 
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本 章 将 主要 介绍 Web 应 用 程序 的 部 署 , 包括 复制 Web 站 点 、 fE IS 下 运行 站 点 和 将 数 
据 库 移动 到 远程 服务 器 。 为 了 让 Internet 上 的 用 户 能 够 访问 Web 站 点 ， 需 要 将 它 发 布 到 与 
Internet 相连 的 生产 服务 器 上 。 通 过 本 章 的 学 习 ， 应 重点 掌握 Web 站 点 的 部 署 方 法 。 

本 章 学 习 目 标 : 

° 复制 Web 站 点 

© 在 IIS 下 运行 Web 站 点 

° 将 数据 移 到 远程 服务 器 


11.1 部 署 Web 站 点 


网 站 或 Web 应 用 程序 设计 开发 完成 后 ， 需 要 发 布 才能 让 用 户 访问 。 使 用 什么 类 型 的 服 
务 器 以 及 将 它 定位 在 哪里 的 服务 器 ， 这 取决 于 具体 的 需求 和 预算 。 可 以 将 站 点 驻 留 在 阁楼 
里 具有 私有 Internet 连接 的 家 用 服务 器 上 , 或 者 可 以 使 用 能 够 直接 连接 到 Internet 主干 的 外 
部 (通常 是 商业 ) 提 供 商 的 服务 器 来 驻 留 它 。VWD 2010 提供 了 发 布 网 站 的 功能 ， 该 功能 将 
网 站 编译 为 一 组 可 以 通过 IIS 直接 执行 的 文件 ,然后 将 这 些 文件 复制 到 目标 Web 服务 器 上 。 


11.1.1 部署 前 的 准备 工作 


当 在 开发 环境 中 实现 Web 站 点 的 第 一 个 版 本 时 , 管理 站 点 及 其 源 代码 就 非常 简单 。 只 
有 站 点 源 代码 的 一 个 版 本 ， 因 此 维护 非常 容易 。 然 而 ， 一 旦 将 站 点 投入 到 生产 环境 中 ， 就 
拥有 站 点 的 两 个 版 本 ， 一 个 在 生产 环境 中 运行 ， 另 一 个 用 于 开发 。 这 就 很 难保 持 同步 。 例 
如 ， 在 生产 环境 中 可 能 使 用 不 同 的 数据 库 和 连接 字符 串 。 如 果 激 活 站 点 时 在 代码 中 直接 进 
行 所 有 修改 , 那么 在 下 一 次 更 新 过 程 中 很 可 能 会 重 写 某 些 设置 , 从 而 产生 不 希望 看 到 的 结果 。 
那么 , 如 何 管理 相同 Web 站 点 的 不 同 版 本 呢 ? 一 种 比较 简单 的 方法 就 是 将 某 些 硬 编码 
的 设置 移动 到 web.config 文件 中 。web.config 配置 文件 使 得 在 开发 环境 和 生产 环境 中 进行 
不 同 设置 变 得 很 容易 。 本 书 前 面 已 经 多 次 使 用 web.config 文件 来 存储 与 连接 字符 串 有 关 的 
信息 ， 还 介绍 了 在 <appSettings> 元 素 中 通过 <add> 标 记 添加 用 户 自 定义 变量 。 
例如 ， 在 web.config 中 有 如 下 定义 : 
<appSettings> 
<add key="CopyRight" value=" 版 权 所 有 小 石头 网 站 " /> 
</appSettings> 
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在 程序 中 可 以 使 用 System.Web.Configuration 命名 空间 的 WebConfigurationManager 类 
来 获取 该 变量 的 值 ， 从 而 只 使 用 一 行 代码 就 能 从 这 些 部 分 检索 数据 。 
另外 ， 还 可 以 使 用 表达 式 语 法 来 访问 <appSettings> 元 素 中 的 数据 ， 格 式 如 下 : 
<%$ AppSettings:AppSettingKeyName %> 


其 中 ，AppSettingKeyName 表示 在 web.config 文件 中 定义 的 键 。 例 如 ， 在 页 面 上 添加 
一 个 Literal 控件 用 来 显示 网 站 的 版 权 信 息 ， 则 可 以 这 样 设 置 Literal 控件 的 Text 属性 : 


<asp:Literal ID="Copyright" runat="server" Text="<%$ AppSettings:CopyRight %>" /> 
通常 将 生产 环境 和 开发 环境 中 参数 不 一 样 的 值 保存 在 web.config 文件 中 ， 通 过 上 述 方 
法 访问 这 些 变量 的 值 ， 从 而 使 站 点 变 得 更 容易 维护 和 部 署 。 
将 硬 编码 的 应 用 程序 设置 移动 到 web.config 文件 之 后 ， 部 署 过 程 的 下 一 步 就 是 创建 
Web 站 点 的 副本 。 


11.1.2 ”复制 Web 站 点 


在 开发 站 点 的 过 程 中 , 使 用 VWD 配置 的 内 置 Web 服务 器 。 虽然 这 个 服务 器 对 于 本 地 
开发 非常 好 ， 但 在 生产 环境 中 就 不 能 使 用 它 。 要 将 站 点 投入 到 生产 环境 中 使 用 ， 需 要 将 它 
部 署 到 运行 IIS 的 计算 机 中 TIS(Internet Information Services) 是 Microsoft 的 专业 Web 服 
务 器 。 

要 将 站 点 部 署 到 生产 服务 器 中 ， 可 以 使 用 表 11-1 显示 的 部 署 目标 (来 自 VWD 内 部 )。 


表 11-1 部署 目 标 
部 署 选 项 描 述 
文件 系统 该 选项 允许 在 开发 计算 机 或 网 络 化 计算 机 的 本 地 文件 系统 上 创建 站 点 副本 。 如 果 
稍 后 要 将 这 些 文件 手动 移动 到 生产 服务 器 中 ， 那 么 这 个 选项 就 很 有 用 
本 地 IIS 该 选项 允许 创建 将 在 本 地 IIS 安装 下 运行 的 站 点 的 副本 
FTP 站 点 该 选项 允许 使 用 FTP 将 组 成 Web 应 用 程序 的 文件 使 用 发 送 到 远程 服务 器 中 
该 选项 允许 将 组 成 Web 应 用 程序 的 文件 发 送 到 远程 IS 服务 器 中 。 要 使 这 个 选项 
远程 站 点 生效 ， 远 程 服务 器 需要 安装 Front Page Server Extensions 
查看 IIS 附带 的 文档 或 者 咨询 远程 服务 器 的 管理 员 可 以 获得 使 用 这 个 选项 的 帮助 


如 果 使 用 的 是 Visual Studio 的 商业 版 本 ， 可 以 使 用 VWD 提供 的 两 种 主要 的 部 署 方 法 
来 访问 这 4 个 部 署 选项 ， 复 制 网 站 和 发 布 网 站 。 如 果 使 用 的 是 免费 的 Express 版 本 ， 则 只 
能 使 用 复制 网 站 。 本 书 只 介绍 复制 网 站 。 

复制 网 站 命令 可 以 使 用 4 个 传输 选项 中 的 任意 一 项 来 创建 站 点 的 副本 。 这 是 将 站 点 快 
速 复 制 到 其 他 位 置 的 好 方法 。 

例 11-1: 使 用 网 站 复制 命令 将 网 站 Chapter7 复制 到 本 地 IIS。 
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(1) 启动 VWD2010， 选 择 “文件 ”|“ 打 开 网 站 ”命令 ， 打 开 网 站 Chapter 7。 

本 例 在 开发 阶段 已 经 将 发 送 邮 件 的 方式 和 邮件 地 址 配置 到 web.config 文件 中 了 ， 所 以 
没有 其 他 需要 移 到 web.config 文件 中 的 参数 了 。 接 下 来 ， 需 要 设置 一 下 站 点 的 起 始 页 。 

(2) 选择 “网 站 ”|“ 启 动 选项 ”命令 ， 打 开 站 点 的 属性 页 ， 在 左 侧 列表 中 选择 “启动 
选项 ”， 然 后 从 右 侧 区 域 ， 选 择 “ 特 定 页 ” 单 选 按钮 ， 单 击 右 侧 的 “浏览 ”按钮 ， 打 开 “ 选 
择 页 码 以 开始 ”对 话 框 ， 这 里 选择 Index.aspx 页 面 为 起 始 页 ， 如 图 11-1 所 示 。 


tJ 


日 


图 11-1 设置 站 点 的 起 始 页 


(3) 单 击 “ 确 定 ” 按 钮 ， 完 成 起 始 页 的 设置 。 
(4) 选择 “网 站 ”|“ 复 制 网 站 ”命令 ， 打 开 “ 复 制 网 站 ”窗口 ， 如 图 11-2 所 示 。 


Lu 12 
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图 11-2 “复制 网 站 ”窗口 


技巧 : 
也 可 以 在 “解决 方案 资源 管理 器 ”窗口 的 工具 栏 中 单 击 复制 网 站 图 标 贺 打开 “复制 网 
站 ”窗口 。 


(5) 单 击 “连接 ”图 标 按钮 ， 打 开 “ 打 开 网 站 ”对 话 框 ， 如 图 11-3 所 示 。 在 该 对 话 框 
中 选择 “本 地 IS” 选 项 ， 单 击 右 上 角 的 “新 建 网 站 ”图 标 最 新 建 一 个 网 站 ， 也 可 以 选择 一 
个 现 有 的 网 站 ， 然 后 单 击 “ 新 建 虚拟 目录 ”图 标 副 为 要 发 布 的 网 站 创建 一 个 虚拟 目录 。 
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= 本 地 Internet Information Server 

选择 要 打开 的 网 站 G). ax 
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图 11-3 “打开 网 站 ”对 话 框 


(6) 创建 了 网 站 或 虚拟 目录 后 ， 单 击 “ 打 开 ” 按 钮 返回 “复制 网 站 ”对 话 框 。 

(7) 在 “ 源 网 站 ”中 选择 文件 ， 然 后 单 击 中 间 的 国 图 标 ， 即 可 将 选中 的 文件 复制 到 指 
定 的 本 地 IIS 站 点 中 。 

单 击 “ 复 制 网 站 ”窗口 中 的 两 个 列表 之 间 的 “同步 选择 的 文件 ”按钮 图， 将 启动 同步 
进程 ， 在 “ 源 网 站 ”和 “远程 网 站 ”之 间 同 步 所 有 文件 。 


11.2 在 IIS 下 运行 站 点 


为 了 在 HS 下 运行 Web 站 点 ， 需 要 执行 下 面 几 个 步骤 : 

(1) 安装 和 配置 IS; 

(2) 安装 和 配置 NET Framework 4; 

(3) 配置 安全 设置 。 

根据 系统 的 当前 状态 ， 有 些 操作 是 可 选 的 。 下 面 将 介绍 如 何 实现 这 些 步 骤 。 


11.2.1 安装 和 配置 Web 服务 器 


虽然 大 多 数 Windows 版 本 都 包含 IS， 但 默认 情况 下 不 会 安装 它 ， 因 此 首先 要 确保 使 
的 Windows 版 本 支持 HS, 然后 就 是 安装 IS。 虽 然 Windows Vista 和 Windows 7 的 Starter 
版 本 和 Home Basic 版 本 提供 了 部 分 IS, 但 不 能 在 它们 上 面 运行 ASP.NET 页 面 , 因此 至 少 
需要 安装 Home Premium 版 本 。Windows 基于 服务 器 的 版 本 则 完全 支持 s. 

要 在 Windows 上 安装 和 配置 HS, 需要 以 Administrator( 管 理 员 ) 身 份 登录 系统 。 除 了 安 
装 IS 之 外 ， 还 要 知道 如 何在 IS 中 创建 和 配置 Web 站 点 。 
1. RŽ IIS 


本 节 将 介绍 如 何 安装 HS， 不 同 版 本 的 安装 过 程 略 有 不 同 ， 下 面 以 Windows XP 和 
Windows 7 为 例 介 绍 安装 的 步骤 。 


We 
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在 Windows XP 和 Windows Server 2003 系统 中 ， 可 以 通过 “控制 面板 ”中 的 “添加 或 
删除 程序 ”来 安装 IS， 或 者 通过 选择 “开始 ”|“ 运 行 ”命令 ， 然 后 通过 输入 appwiz.cpl 
来 打开 “添加 和 删除 程序 ”对 话 框 。 接 着 ， 单 击 对 话 框 左边 的 “添加 /删除 Windows 组 件 ” 
EER, DJE “Windows 组 件 向 导 ” 对 话 框 ， 如 图 11-4 所 示 。 

在 “组 件 ” 列 表 中 ， 选 中 “Intemet 信息 服务 QIS)” 复 选 框 ， 然 后 单 击 “ 详 细 信 息 ” 
按钮 。 在 打开 的 对 话 框 中 至 少 选中 “公用 文件 ”和 “Internet 信息 服务 管理 单元 ” 复 选 框 ， 
其 他 选项 为 可 选 。 

在 Windows 7 和 Windows Vista 系统 中 ， 通 过 “程序 和 功能 ”部 分 来 安装 IS， 可 以 通 
过 “控制 面板 ”或 单 击 “开始 ”按钮 ， 在 “搜索 ” 框 中 输入 appwiz.cpl， 然 后 按 回 车 键 来 
访问 这 个 部 分 ,在 “程序 和 功能 ”中 , 单 击 “ 打 开 和 关闭 Windows 功能 ”链接 来 打开 “Windows 
功能 ”对 话 框 ， 如 图 11-5 所 示 。 
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图 11-4 “Windows 组 件 向 导 ” 对 话 框 图 11-5 “Windows 功能 ”对 话 框 


单 击 “Internet 信息 服务 ”选项 ， 这 会 选择 它 的 一 些 必需 的 子 功能 。 然 后 展开 “Internet 
信息 服务 ”|“ 万 维 网 服务 ”|“ 应 用 程序 开发 功能 ”， 并 选择 ASP.NET 选项 。 这 也 会 选中 
其 他 一 些 相 关 的 功能 。 最 后 ， 单 击 “ 确 定 ” 按 钮 ，Windows 将 开始 安装 所 选 的 功能 。 


说 明 : 
IS 安装 过 程 中 ， 会 提示 用 户 插入 系统 盘 ， 请 事先 准备 操作 系统 的 安装 介质 。 


2. 安装 和 配置 ASP.NET 


成 功 安装 HS 之 后 ， 还 要 确保 已 经 安装 了 Microsoft.NET Framework 4。 如 果 在 目标 计 
算 机 上 安装 了 VWD 2010， 那 么 就 已 经 安装 了 .NET Framework 4。 和 否则 就 要 从 Microsoft 站 
点 中 下 载 ， 其 地 址 是 http://msdn.microsoft.com/en-us/netframework。 下 载 之 后 ， 可 以 运行 安 
装 程序 ， 并 按照 向 导 提 示 操 作 。 

如 果 计 算 机 上 已 经 安装 了 .NET Framework 4， 后 来 才 安 装 IIS， 那 么 就 要 告诉 IS 已 经 
存在 Framework。 通 常情 况 下 ， 这 将 在 .NET Framework 的 安装 过 程 中 完成 。 如 果 后 来 才 安 
装 IS， 那 么 就 要 手动 完成 该 操作 。 

在 IIS 中 注册 ASP.NET 的 步骤 如 下 。 
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(D 打开 命令 行 窗口 。 
(2) 通过 输入 下 面 的 命令 导航 到 .NET Framework 4 文件 夹 : 


cd \WINDOWS\Microsoft.NET\Framework\v4.0.30319 


注意 : 
在 用 户 的 计算 机 上 ，v4.0 后 欧盟 的 实际 版 本 号 可 能 会 有 所 不 同 。 另 外 ， 如 果 使 用 的 是 
64 位 的 Windows 版 本 ， 那 么 Framework 文件 夹 命名 则 为 Framework64。 


(3) 输入 aspnet regiis -i, 之 后 会 收 到 ASP.NET 4 已 经 成 功 地 安装 在 IIS 中 注册 的 消息 。 
11.2.2 IIS 中 的 安全 性 


由 于 VWD 2010 中 内 置 Web 服务 器 的 无 颖 集成 ， 可 能 还 不 知道 内 部 发 生 的 情况 ， 也 
不 知道 在 浏览 站 点 中 的 页 面 时 哪些 安全 设置 有 效 。 为 了 使 用 站 点 内 的 资源 ， 例 如 ASPX 文 
件 、 后 台 代 码 文件 、App_Data 文件 夹 中 的 数据 库 和 站 点 内 的 图 像 ，Web 服务 器 需要 从 
Windows 获得 访问 这 些 资源 的 权限 。 这 就 意味 着 要 配置 Windows， 授 权 Web 服务 器 使 用 
的 账户 访问 这 些 资源 的 权限 。 

需要 权限 的 特定 账户 取决 于 Windows 版 本 ， 以 及 是 在 IS 下 运行 站 点 还 是 使 用 内 置 
Web 服务 器 运行 站 点 。 

内 置 Web 服务 器 使 用 的 账户 是 用 来 登录 Windows 计算 机 的 账户 。 这 个 账户 通常 是 “ 域 
名 \ 用 户 名 ”或 “机 器 名 \ 用 户 名 ”。 在 Windows 上 使 用 这 个 账户 登录 , 就 启动 了 VWD 2010, 
它 再 启动 内 置 的 Web 服务 器 ， 整 个 Web 服务 器 都 使 用 证 书 凭据 运行 。 由 于 通常 登录 计算 
机 的 账户 是 本 地 Windows 计算 机 上 的 Administrator 或 者 超级 用 户 , 具有 访问 组 成 站 点 的 所 
有 文件 的 权限 ， 因 此 到 目前 为 止 可 能 一 切 正 常 ， 不 需要 修改 安全 设置 。 

如 果 使 用 的 是 US, 情况 则 完全 不 同 。 在 默认 情况 下 , IIS 下 的 ASP.NET 应 用 程序 使 用 
在 安装 IIS 时 创建 的 特定 账户 运行 ,在 Windows XP 中 ,这 个 账户 名 为 ASPNET; 在 Windows 
Vista 以 及 Windows Server 2003 和 2008 中 ,这 个 账户 名 为 Network Service; 而 在 Windows 
7 和 Windows Server 2008 R2 中 则 为 ApplicationPoolIdentity。 除 了 ASP.NET 应 用 程序 使 用 
的 账户 之 外 ， 还 需要 配置 Web 服务 器 用 于 访问 资源 的 账户 ， 这 些 资源 不 直接 与 ASP.NET 
相关 ， 如 图 像 、CSS 文件 等 。 


注意 : 
在 系统 中 不 能 直接 找到 ApplicationPoolldentity 用 户 账户 ,因为 它 取决 于 配置 的 应 用 程 
序 池 的 名 称 。 


在 找到 需要 配置 的 账户 之 后 ， 最 后 一 步 就 是 配置 文件 系统 。 

不 管 使 用 的 是 哪个 账户 ， 都 需要 修改 Windows 文件 系统 ， 从 而 允许 Web 服务 器 访问 
资源 。 这 只 有 在 使 用 NTFS 而 不 是 FAT 或 FAT32( 旧 的 Microsoft 文件 系统 ) 格 式 化 硬盘 驱 
动 器 时 才 有 必要 。 
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在 标准 Windows 系统 上 ,都 使 用 Windows NTFS 文件 系统 保护 所 有 文件 和 文件 夹 。 为 
了 确保 Web 站 点 正确 运行 ， 需 要 给 Web 服务 器 使 用 的 账户 授予 必要 的 权限 ， 以 允许 他 们 
访问 Web 站 点 上 的 文件 和 文件 夹 。 对 于 大 多 数 文件 和 文件 夹 而 言 , 具有 读 取 权限 就 足够 了 。 
然而 ， 对 于 App Data 文件 夹 通常 需要 在 运行 时 写 入 ， 因 此 需要 给 账户 授予 对 这 个 文件 来 
的 修改 和 写 入 权限 。 

例 11-2: 以 App Data 文件 夹 为 例 ， 授 予 ASPNET 用 户 对 文件 夹 的 访问 权限 。 

(1) 打开 Windows 资源 管理 器 ， 找 到 App Data 文件 夹 ， 右 击 该 文件 夹 ， 从 弹出 的 快 
捷 菜单 中 选择 “属性 ”命令 , 打开 该 文件 夹 的 属性 对 话 框 ， 选择 “安全 ”选项 卡 ， 如 图 11-6 
所 示 。 此 时 在 “组 或 用 户 名 称 ” 列 表 中 还 没有 ASPNET 用 户 。 

O) 单 击 “ 添 加 ”按钮 ， 打 开 “ 选 择 用 户 或 组 ”对 话 框 ， 在 “输入 对 象 名 称 来 选择 ” 
文本 区 域 中 输入 ASPNET， 然 后 单 击 “ 检 查 名 称 ”按钮 ， 系 统 将 自动 检查 ， 并 以 “机 器 名 / 
用 户 名 ”的 形式 更 新 “输入 对 象 名 称 来 选择 ”文本 区 域 ， 如 图 11-7 所 示 。 


二 加 四) BRD 

Aninistrator BIRR) EN SANESE O 

Ezi] 0 oi BP. RAREHERA 
n m- E 查找 位 置 中) 

IE: 

列 出 廊 人 天 日 录 日 日 pe 
ay s ol MANRERRER CDW 

siono 5 = m TENE 
ANRE ARE , iñ pah n" a Er) t] 

CI Cm 


图 11-6 文件 夹 属性 对 话 框 的 “安全 ”选项 卡 图 11-7 “选择 用 户 或 组 ”对 话 框 


技巧 : 
也 可 以 单 击 “ 选 择 用 户 或 组 ”对 话 框 中 的 “高 级 ”按钮 进行 查找 ， 然 后 从 用 户 列表 中 
选择 ASPNET 用 户 。 


G) 单 击 “ 确 定 ” 按 钮 ， 关 闭 “ 选 择 用 户 或 组 ”对 话 框 ， 此 时 ，ASPNET 用 户 将 被 添 
加 到 “组 合用 户 名 称 ” 列 表 中 。 默 认 情 况 下 , 该 用 户 对 当前 文件 夹 有 “ 读 取 和 运行 ”、“ 列 
出 文件 夹 目 录 ” 和 “ 读 取 ” 的 权限 ， 如 图 11-8 所 示 。 

(4) 只 需 选择 “ 写 入 ”权限 对 应 的 “允许 ” 列 的 复 选 框 即 可 为 ASPNET 用 户 增加 写 入 
权限 ， 单 击 “ 应 用 ”按钮 ， 使 设置 生效 。 
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图 11-8 ASPNET 用 户 的 默认 权限 
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将 站 点 发 布 到 本 地 计算 机 上 的 s 中 非常 简单 。 只 要 将 数据 复制 到 新 位 置 ， 配 置 IS， 
然后 修改 一 些 安全 设置 即 可 。 因 为 站 点 继续 使 用 SQL Server 2008 Express 版 本 ， 它 会 正常 
运行 。 

如 果 要 将 站 点 移动 到 外 部 服务 器 或 主机 ， 事 情 就 没 那么 简单 了 。 虽 然 使 用 FTP 复制 组 
成 站 点 的 文件 非常 简单 ， 但 将 数据 从 SQL Server 2008 数据 库 复 制 到 另 一 台 主 机 通常 有 些 
诀窍 。 这 是 因为 大 多 数 Web 主机 不 支持 SQL Server 2008 Express 版 本 ， 因 此 不 能 只 将 .mdf 
文件 复制 到 远程 主机 上 的 App_Data 文件 夹 中 。 相 反 ， 这 些 主机 通常 提供 SQL Server 的 完 
全 版 本 ， 可 以 使 用 基于 Web 的 管理 工具 或 使 用 像 SQL Server Management Studio 这 样 的 工 
具 来 访问 它们 。 


11.3.1 使 用 Database Publishing Wizard 


为 了 方便 地 将 数据 从 本 地 SQL Server 2008 数据 库 传送 到 Web 主机 的 SQL Server 数据 
库 中 ，Microsoft 创建 了 Database Publishing Wizard。 

Database Publishing Wizard 允许 创建 .sql 脚本 , 它 包 含 在 远程 服务 器 上 重建 数据 库 及 其 
数据 所 需 的 全 部 信息 和 远程 服务 器 上 的 数据 。 重 建 数据 的 步骤 如 下 。 

(1) 从 本 地 SQL Server 数据 库 创 建 .sql 脚本 ; 

(2) 将 这 个 脚本 发 送 到 远程 主机 并 执行 。 

例 11-3: 导出 WeiBo 数据 库 。 

(1) 在 VWD 中 打开 任意 一 个 项 目 , 选择 “视图 ”|“ 服 务 器 资源 管理 器 ”命令 打开 “ 服 
务 器 资源 管理 器 ”窗口 。 

(2) 展开 “数据 连接 ”节点 , 右 击 WeiBo.dbo 数据 库 , 从 弹出 的 快捷 菜单 中 选择 Publish 
to Provider 命令 ， 打 开 Database Publishing Wizard 对 话 框 。 首 先 弹 出 的 是 欢迎 页 面 ， 如 图 
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11-9 所 示 。 
(3) 单 击 “ 下 一 步 ” 按 钮 ， 进 入 “选择 数据 库 ” 页 面 ， 如 图 11-10 所 示 。 
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图 11-9 欢迎 页 面 图 11-10 “选择 数据 库 ” 页 面 


(4) 选择 WeiBo 数据 库 ， 并 选中 “为 所 选 数 据 库 中 的 所 有 对 象 编写 脚本 ” 复 选 框 ， 然 
后 单 击 “ 下 一 步 ”按钮 。 进 入 “选择 输出 位 置 ”页面 ， 如 图 11-11 所 示 。 

(S) 在 这 个 页 面 中 , 有 两 个 选项 。 第 一 个 选项 允许 使 用 所 需 的 SQL 语句 创建 文本 文件 ， 
第 二 个 选项 允许 通过 Intemet 直接 与 共享 的 主机 提供 商会 话 。 此 处 选择 “将 脚本 保存 到 文 
件 ” 单 选 按钮 ， 在 “文件 名 ”文本 框 中 输入 保存 的 位 置 和 文件 名 ， 单 击 “ 下 一 步 ” 按 钮 ， 
进入 “选择 发 布 选项 ”页 面 ， 如 图 11-12 所 示 。 
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图 11-11 “选择 输出 位 置 ”页 面 图 11-12 “选择 发 布 选项 ”页 面 


(6) 继续 单 击 “ 下 一 步 ” 按 钮 ， 进 入 “检查 摘要 ”页 面 ， 如 图 11-13 所 示 ， 该 页 显示 
了 前 面 所 做 的 选择 。 

(7) 单 击 “ 完 成 ”按钮 ， 将 出 现 “数据 库 发 布 进度 ”页 面 ， 如 图 11-14 所 示 。 向 导 会 
在 指定 文件 夹 中 生成 SQL 脚本 。 单 击 “关闭 ”按钮 ， 完 成 数据 库 导 出 操作 。 
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(8) 可 以 用 记事 本 打开 生成 的 .sql 文件 ， 查 看 它 包含 的 SQL 语句 。 且 可 以 使 用 它 在 兼 
容 的 SQL Server 2008 数据 库 上 重建 数据 库 。 

数据 库 的 内 容 可 以 分 为 两 类 : 数据 库 的 结构 和 实际 数据 。Database Publishing Wizard 
运行 时 ， 首 先 调查 数据 库 的 结构 ， 并 为 它 在 数据 库 内 找到 的 所 有 项 创建 SQL CREATE 语 
句 ， 然 后 创建 INSERT 语句 ， 这 些 语句 在 目标 数据 库 内 重建 所 有 记录 。 


11.3.2 ”创建 数据 库 


虽然 每 个 主机 在 提供 对 SQL Server 的 访问 权时 都 有 自己 的 规则 和 程序 , 但 它们 可 以 分 
为 3 类 。 
e 第 一 类 ， 有 些 主机 不 允许 远程 访问 数据 库 ， 它 要 求 提交 .sql 文件 以 便 执行 它 。 在 这 
种 情况 下 ， 除 了 发 送 文件 然后 等 待 主机 创建 数据 库 之 外 ， 不 需要 做 任何 事情 。 
e P-K, 包含 的 主机 允许 通过 Web 接口 执行 SQL 语句 。 通常 需 要 登录 联机 控制 面 
板 , 然后 通过 上 传 文件 或 者 将 其 内 容 粘 贴 到 Web 页 面 中 的 文本 区 , 来 执行 Database 
Publishing Wizard 导出 的 SQL 语句 。 不 管 使 用 哪 种 方法 , 最 终 都 要 使 用 从 应 用 程序 
可 以 访问 的 数据 库 。 
° 第 三 类 ,包含 的 主机 允许 通过 Internet 连接 到 SQL Server。 这 允许 使 用 像 SQL Server 
Management Studio 这 样 的 工具 从 桌面 连接 到 主机 上 的 数据 库 , 并 远程 执行 SQL 脚本 。 
SQL Server Management Studio 也 有 免费 的 Express 版 本 ， 可 以 从 Microsoft 网 站 
(http://www.microsoft.com/vstudio/express/sql) 下 载 。 该 工具 的 运行 原理 与 商业 版 几乎 相同 。 
在 日 标 服务 器 上 重建 数据 库 之 后 , 需要 修改 Web 站 点 内 的 连接 字符 串 ， 以便 重 新 配置 
ASP.NET 应 用 程序 ， 从 而 使 用 新 的 数据 库 。 需 要 修改 两 个 连接 字符 串 : 一 个 是 连接 用 户 数 
据 库 的 连接 字符 串 ， 另 一 个 是 ASP.NET Application Services 默认 使 用 的 LocalSqlServer 连 
接 字 符 串 。 
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部 署 是 Web 站 点 开发 后 期 的 重要 操作 。 然 而 ,不 可 能 只 部 署 站 点 一 次 。 只 要 发 布 了 站 
点 的 第 一 个 版 本 ， 就 要 考虑 添加 其 他 的 新 功能 ， 因 此 应 尽量 让 站 点 部 署 比较 容易 且 灵 活 。 
通常 在 部 署 之 前 ， 需 要 将 硬 编码 的 配置 设置 移动 到 web.config 文件 中 ， 然 后 使 用 Database 
Publishing Wizard 导出 数据 库 ， 以 便 在 远程 服务 器 重建 数据 库 ， 最 后 通过 “复制 站 点 ”或 
“发 布 站 点 ”功能 实现 站 点 的 复制 和 发 布 。 通 过 本 章 的 学 习 ， 读 者 应 掌握 站 点 的 部 署 与 发 
布 的 基本 操作 ， 并 能 够 将 网 站 所 需 的 数据 库 迁 移 到 远程 服务 器 上 。 


11.5 思考 和 练习 


L 要 将 站 点 部 署 到 生产 服务 器 中 ， 可 以 使 用 哪些 部 署 目标 ? 
2. 运用 本 章 所 学 知识 ， 将 前 面 创建 的 网 站 复制 到 本 地 ts. 
3. 简 述 将 数据 库 导 出 为 sql 脚本 的 过 程 和 步骤 。 
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微 博 ， 即 微型 博客 ， 是 随 着 Web 2.0 而 兴起 的 一 类 开放 的 互联 网 社交 服务 ， 它 允许 用 
户 以 简短 文字 随时 随地 更 新 自己 的 状态 ， 每 条 信息 的 长 度 都 在 140 字 以 内 ， 支 持 图 片 、 音 
频 和 视频 等 多 媒体 的 出 版 ， 每 个 用 户 既 是 微 内 容 的 创造 者 也 是 微 内 容 的 传播 者 和 分 享 者 。 

本 章 将 综合 运用 前 面 所 学 内 容 ， 创 建 一 个 简易 的 微 博 平 台 ， 支 持 用 户 发 表 微 博 ， 评 论 
或 转播 微 博 ， 以 及 用 户 之 间 的 收听 等 功能 。 通 过 本 章 的 学 习 ， 读 者 将 掌握 一 个 独立 的 Web 
站 点 从 设计 到 实现 的 开发 流程 和 基本 方法 ， 同 时 复习 全 书 所 学 内 容 。 

本 章 学 习 目 标 : 

o 进一步 熟悉 ASP.NET 编程 技术 

° 掌握 网 站 设计 与 实现 的 基本 流程 

通用 类 的 创建 

e° 业务 逻辑 与 界面 展示 的 分 离 

o 使 用 母 版 页 

° 综合 运用 本 书 所 学 知识 


12.1 系统 设计 


一 个 完整 的 软件 系统 开发 过 程 分 为 软件 定义 阶段 、 软 件 开 发 阶段 和 软件 运行 维护 阶段 。 

e 软件 定义 阶段 主要 决定 将 要 开发 软件 的 功能 和 特性 。 它 又 可 以 细 分 为 问题 的 定义 、 
可 行 性 研究 、 需 求 分 析 3 个 阶段 。 

e 软件 开发 阶段 又 可 细 分 为 总 体 设计 、 详 细 设 计 、 程 序 编制 和 软件 测试 4 个 阶段 。 

e 软件 运行 维护 阶段 的 主要 任务 是 通过 各 种 必要 的 维护 活动 使 系统 持久 地 满足 用 户 
的 需求 。 

本 章 要 开发 的 是 一 个 简易 的 微 博 系统 ， 将 重点 介绍 需求 分 析 和 总 体 设计 以 及 编码 实现 。 


121.4 需求 分 析 


微 博 是 一 个 基于 用 户 关系 的 信息 分 享 、 传 播 以 及 获取 平台 。 它 十 分 简单 ， 也 十 分 便捷 ， 
即时 通讯 功能 非常 强大 ， 一 般 发 布 的 消息 只 是 由 简单 的 只 言 片 语 组 成 ， 对 用 户 的 技术 要 求 
门槛 很 低 ， 而 且 在 语言 的 编排 组 织 上 不 需要 长 篇 大 论 ， 只 需要 反映 自己 的 心情 即 可 。 

在 本 微 博 系 统 中 ， 用 户 可 以 发 表 、 转 发 或 评论 消息 (由 于 篇 幅 所 限 ， 本 系统 只 支持 文本 
消息 )， 随 时 看 到 被 关注 者 的 最 新 动态 ,还 可 以 浏览 非 关注 者 发 表 的 最 新 消息 。 用 户 之 间 可 
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以 收听 或 者 取消 收听 。 用 户 对 自己 发 表 的 消息 可 以 进行 删除 等 操作 。 
系统 的 用 例 图 如 图 12-1 所 示 。 


图 12-1 微 博 系统 用 例 分 析 


12.1.2 ”数据 库 设计 


本 系统 涉及 的 数据 实体 有 用 户 、 消 息 和 评论 。 另 外 还 有 一 个 用 户 与 用 户 之 间 的 关系 。 
相应 的 数据 库 设计 我 们 在 本 书 第 5 章 已 经 介绍 过 ， 请 参考 本 书 5.1.2 节 。 


12.2 ”系统 实现 


本 节 将 详细 介绍 微 博 系统 的 实现 。 包 括 数据 操作 类 的 创建 与 实现 、 实 体 类 的 创建 、 以 
及 各 Web 窗 体 的 设计 与 实现 。 
首先 启动 VWD 2010， 新 建 空 网 站 MiniWeiBo。 


12.2.1 数据 访问 类 


因为 几乎 所 有 页 面 都 涉及 数据 库 的 访问 ， 所 有 把 访问 数据 库 的 操作 抽象 为 一 个 独立 的 
公共 类 文件 DB.cs。 并 把 数据 库 连 接 字 符 串 存放 到 web.config 配置 文件 中 。 
在 web.config 配置 文件 中 设置 数据 库 连 接 信息 ， 添 加 语句 如 下 : 


<connectionStrings> 
<add name="WeiBoDb" connectionString="Data Source=zhao\sqlexpress;Initial 
Catalog=WeiBo;Integrated Security=True" 
providerName="System.Data.SqlClient" /> 
</connectionStrings> 


在 “解决 方案 资源 管理 器 ”窗口 中 ， 为 项 目 添加 ASP.NET 文件 夹 App Code, 在 
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App Code 目录 中 , 添加 一 个 C# 类 文件 DB.cs, 在 该 类 中 , 添加 对 数据 库 的 操作 ， 代 码 如 下 : 


using System.Data; 


using System.Data.SqlClient: 


using System.Collections; 


using System. Web.Configuration; 


public class DB 


{ 


private SqlConnection con = null; 


private string strConn; 
private SqlTransaction tran; 
public DBO 
{ 
strConn = WebConfigurationManager.ConnectionStrings["WeiBoDb"].ToString0; 
} 
/打开 数据 库 连 接 
public void open() 
{ 
if (con == null ) 
con = new SqlConnection(strConn); 
if (con.State.Equals(ConnectionState.Closed)) 
con.Open(); 
} 
// 关 闭 数据 库 
public void close) 
{ 
if (con = null) 
return; 
if (con.State.Equals(ConnectionState.Open)) 
{ 
con.Close(): 
con.Dispose(); 
con = null; 
) 
else 
{ 
con.Dispose(); 
con = null; 
} 
} 
// 执 行 SQL 语句 
public int ExecuteSQLNonQuery(string sqlStr) 
{ 
try 


{ 
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this.open(0;// 打 开 连 接 
SqlCommand cmd = new SqlCommand(sqlStr, con): 
return cmd.ExecuteNonQuery(0; 
} 
catch 
{ 
return -1; 
} 
finally 
Í 
close(); 
} 


} 
/执行 SQL 语句 ， 不 关闭 连接 ， 事 务 处 理 使 用 
public int ExecuteSQLNonQueryWithTran(string sqlStr) 
int ret = 0; 
try 
{ 
this.open();// 打 开 连 接 
SqlCommand cmd = new SqlCommand(sqlStr, con); 
cmd.Transaction = tran: 
ret = cmd.ExecuteNonQuery(); 
} 
catch (Exception e) 
{ 
throw e; 
) 
return ret; 
) 
/执行 SQL 语句 ,传递 参数 给 SqlCommand 
public int ExecuteSQLNonQueryWithParam(string sqlStr, List<SqlParameter> sqlParams) 
{ 
try 
this.open0;// 打 开 连 接 
SqlCommand cmd = new SqlCommand(sqlStr, con): 
foreach(SqlParameter p in sqlParams) 


cmd.Parameters.Add(p); 
return cmd.ExecuteNonQuery(); 
} 
catch 
{ 


retum -1; 
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} 
finally 
{ 
close(); 
} 


} 
// 执 行 SQL 语句 ， 返 回 查 询 的 表 
public DataTable GetDataTable(string sqlStr) 
í 
DataTable dt; 
try 
{ 
open0; 
SqlDataAdapter sda = new SqlDataAdapter(sqlStr, con); 
DataSet ds = new DataSet(); 
sda.Fill(ds): 
dt = ds.Tables[0]: 
) 
catch (Exception ex) 
{ 
dt = null; 
) 
finally 
{ 
close0; 
) 
return dt; 
) 
/执行 SQL 语句 ， 返 回 DataRow 
public DataRow GetDataRow(string sqlStr) 
{ 
DataRow dr; 
try 
{// 调 用 该 类 GetDataTable 方法 
dr = GetDataTable(sqIStr).Rows[0]: 


) 
catch 
{ 
dr = null; 
} 
finally 
{ 
close(); 
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return dr; 
} 
public void BeginTrans() 
{ 
tran = con.BeginTransaction(); 
} 
public void CommitO 
{ 
tran.Commit(); 
} 
public void Rollback() 
{ 
tran.Rollback(); 
} 


} 

该 类 中 包括 一 个 构造 函数 DBO， 打 开 数据 库 连 接 方法 open0， 关 闭 连接 方法 close), 
执行 非 查询 SQL 语句 方法 ExecuteSQLNonQuery(string sqlStr)， 执 行 带 有 参数 的 SQL 语句 
方法 ExecuteSQLNonQueryWithParam, 获取 DataTable 对 象 的 查询 方法 GetDataTable(string 
sqlStr) 和 获取 DataRow 的 查询 方法 GetDataRow(string sqlStr), 以 及 事务 处 理 相 关 的 几 个 方法 。 


12.2.2 ”数据 实体 类 


在 微 博 系统 中 的 操作 可 分 为 两 类 ， 一 类 是 针对 用 户 的 ， 另 一 类 是 针对 消息 的 。 所 以 要 
把 用 户 和 消息 分 别 封装 为 不 同 的 实体 类 ， 然 后 在 类 中 实现 相应 的 操作 。 
1. 用 户 实 体 类 Zuser.cs 
在 App_Code 目录 中 添加 新 的 类 文件 Zuser.cs。 在 该 类 中 添加 操作 Z_USER 表 所 需 的 
成 员 变量 。 通 常 类 成 员 变量 定义 为 私有 的 ， 然 后 定义 相应 的 属性 来 访问 这 些 私 有 变量 ， 本 
书 为 了 使 程序 简化 ， 直 接 将 成 员 定义 为 自动 属性 。 相 应 的 代码 如 下 : 
public int user_id{get;set;} 
public string user name {get;set;} 


public string user login {get;set;} 
public string user password {get;set;} 
public string user_sex {get;set;} 
public byte[] user_photo {get:set:} 
public string user_email {get;set;} 
public DateTime regist_time {get;set;} 


public string user_address {get;set;} 
public DateTime user birthday {get;set;} 
public string user telephone {get;set;} 
public string home url {get;set;} 
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public string user imfo {get;set;} 
public string errorMsg{fgetset} ”// 用 于 存放 错误 消息 
Ez Y Z USER 表 字 段 的 自动 属性 之 外 ， 上 述 代码 还 定义 了 一 个 errorMsg 属性 , 该 属性 
的 作用 是 当 对 用 户 的 操作 失败 或 出 现 异 常 时 ， 反 馈 错误 信息 给 调用 者 。 
接 下 来 ， 添 加 一 个 构造 函数 ， 根 据 指定 的 用 户 id 初始 化 用 户 信息 ， 代 码 如 下 : 


public Zuser(int userId)// 构 造 函 数 


{ 
string sqlStr = "SELECT * FROM Z USER WHERE user id=" + userld.ToString(); 
DB db = new DBO; 
DataRow dr = db.GetDataRow(sqlStr); 
if (dr == null) 
{ 
errorMsg = "指定 的 用 户 id 不 存在 "; 
user id = -1; 
) 
else 
í 
Init(dr); 
) 
} 
private void Init(DataRow dr)// 初 始 化 
{ 


user_id = Int32.Parse(dr["user id"].ToStringO); 
user name = dr["user name"].ToString(); 
user login = dr["user_ login"].ToString(); 
user password = dr["user_password"].ToString(); 
user sex = dr["user_sex"].ToString(); 
if (dr.IsNull("user photo")) 

user photo = null; 
else 

user photo = (byte[])dr["user_photo"]; 
if (dr.IsNull("user_email")) 

user email = null: 
else 

user email = dr["user_email"].ToStringO; 
regist time = (DateTime)dr["regist time"]; 
if (dr.IsNull("user_address")) 

user_address = null; 
else 

user address = dr["user_address"].ToString0; 
if (dr.IsNull("user_birthday")) 


else 
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user birthday = (DateTime)dr["user birthday"]: 
if (dr. IsNull("user telephone")) 
user telephone = null; 
else 
user telephone = dr["user_telephone"].ToString0; 
home url = dr["home_url"].ToStringO: 
if (dr.IsNull("user_info")) 
user_info = null; 
else 
user_info = dr["user info"].ToStringO; 
) 
与 用 户 相关 的 操作 主要 有 如 下 几 个 。 
e 注册 新 用 户 ， 包 括 注册 前 的 检查 用 户 名 和 个 人 微 博 地 址 是 否 可 用 。 
e° 用 户 登录 系统 , 登录 成 功 后 获取 用 户 收听 的 用 户 数 、 用 户 的 听众 数 和 用 户 发 表 的 消 
息 数 等 信息 。 
e 个 人 信息 维护 。 
e° 发 表 新 消息 。 
° 
° 


收听 和 取消 收听 其 他 用 户 ， 包 括 检查 是 否 已 经 收听 某 用 户 。 
查找 用 户 。 
相应 方法 的 实现 如 下 所 示 : 
public bool login(string userLogin, string userPassword)// 登 录 


{ 
string sqlStr = "SELECT * FROM Z_ USER WHERE user login=" + userLogin +""; 
DB db = new DBO; 
DataRow dr = db.GetDataRow(sqlStr); 


if (dr == null) 
{ 
errorMsg = "登录 名 不 存在 ": 
return false; 
} 
if (dr["user_password"].ToString() == userPassword ) 
{ 
Init(dr); 
return true; 
} 
else 
{ 
errorMsg = "密码 输入 有 误 "; 
return false; 
} 


; 
public bool register0// 注 册 
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Í 
bool ret = true; 
string sqlString = "INSERT INTO Z_USER(user name,user login," + 
"user password,user sex,home url) values(" + user name+","+ 
user login + ","" + user_password+ ",'" + user _sex + "," + home url + "")"; 
DB db = new DBQ; 
db.openO; 
db.BeginTrans(); 
try 
{ 
int result = db.ExecuteSQLNonQueryWithTran(sqlString); 
1f (result < 1) 
í 
db.Rollback(); 
throw new Exception(" 插 入 新 记录 失败 "); 
} 
sqlString = "UPDATE Z_USER SET user name = user name"; 
if (user email.Length > 0) 
sqlString += ",user_email=" + user_email + ""; 
if (user_info.Length > 0) 
sqlString += ",user_info=" + user_info + ""; 
if (user address.Length > 0) 
sqlString += ",user_address="" + user_address + """; 
sqlString +=" WHERE user login=" + user login + ""; 
Tesult = db.ExecuteSQLNonQueryWithTran (sqlString); 
if (result < 1) 
{ 
db.Rollback(); 
throw new Exception(" 操 作 失 败 "); 
} 
db.CommitO: 
) 
catch (Exception e) 
i db.Rollback(); 
ret = false; 
errorMsg = e.Message; 
} 
finally 
{ 
db.close(); 
return ret; 
} 
public bool checkLogin(string userLogin)// 检 查 登 录 名 是 否 可 用 
í 


string sqlStr = "SELECT * FROM Z _ USER WHERE user login=" + userLogin + ""; 
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DB db = new DBO:; 
DataRow dr = db.GetDataRow(sqlStr); 
if (dr = null) 

return false:// 用 户 名 不 存在 
return true; 


} 
public bool checkUrl(string homeUrDV/ 检 查 个 人 微 博 地 址 是 否 可 用 
í 
string sqlStr = "SELECT * FROM Z_ USER WHERE home_url="" + homeUrl + "™; 
DB db = new DBO; 
DataRow dr = db.GetDataRow(sqlStr); 
if (dr = null) 
return false;// 个 人 微 博 地 址 不 存在 
return true; 


} 
public string getOther(int userId)// 获 取 用 户 收听 的 用 户 数 
{ 
string sqlStr = "SELECT COUNT(*) FROM Z_USER_FUN WHERE user_id =" + 
user_id.ToString(); 
DB db = new DBO; 
DataRow dr = db.GetDataRow(sqlStr); 
return dr[0].ToString0; 


} 
public string getFun(int userId)// 获 取 用 户 的 听众 数 


{ 
string sqlStr ="SELECT COUNT(*) FROM Z_USER_FUN WHERE fun user id="+ 


user_id.ToString(); 
DB db = new DB0: 
DataRow dr = db.GetDataRow(sqlStr); 
return dr[0].ToString(): 
j) 
public string getMsg(int userId)// 获 取 用 户 发 表 的 消息 数 
{ 
string sqlStr = "SELECT COUNT(*) FROM Z MESSAGE WHERE user_id =" + 
user_id.ToString(); 
DB db = new DBO: 
DataRow dr = db.GetDataRow(sqlStr); 
return dr[0].ToStringO: 
} 
public byte[] getPhotoById(string userId)// 根 据 user_id 获取 用 户头 像 ， 用 于 显示 
{ 
string sqlStr= "SELECT user sex.user photo FROM Z USER WHERE user_id = " + userId; 
DB db = new DBO; 
DataRow dr = db.GetDataRow(sqlStr); 
user_sex = dr["user sex"].ToString0// 返 回 性 别 用 于 设置 默认 头像 (对 于 为 上 传 头像 的 用 户 ) 
1f(dr IsNull("user photo")) 
return null; 
else 
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return (byte[])dr["user_photo"]; 
} 
public DataTable getUserOther(string userId)// 获 取 用 户 收听 的 用 户 列表 
{ 
string sqlStr = "SELECT * 'touxiang.aspx?userid=' + LTRIM(STR(user 1d)) AS photo path " + 
"FROM Z USER WHERE user_id IN (SELECT fun user id FROM Z USER FUN 
WHERE user_id =" + userId + ")"; 
DB db = new DBO); 
return db.GetDataTable(sqlStr); 
} 
public DataTable getUserFun(string userId)// 获 取 用 户 的 听众 列表 
{ 
string sqlStr = "SELECT * 'touxiang.aspx?userid=' + LTRIM(STR(user_id)) AS photo _path " + 
" FROM Z_USER WHERE user_id IN (SELECT user_id FROM Z_USER_FUN 
WHERE fun_user_id =" + userId + ")"; 
DB db = new DB0: 
return db.GetDataTable(sqlStr); 


) 
public DataTable searchUser(string name,string address)/ 模 糊 查 询 指定 条 件 的 用 户 
{ 
string sqlStr = "SELECT * 'touxiang.aspx?userid=' + LTRIM(STR(user_id)) AS photo_path 
"+ 
" FROM Z_USER WHERE user_name LIKE '%" + name + "%'"; 
if(address.Length>0) 
sqlStr += " AND user_address LIKE '%" + address + "%'"; 
DB db = new DBO: 
return db.GetDataTable(sqlStr); 
ji 
public bool hasListen(string uid)// 是 否 已 收听 指定 用 户 
Í 


string sqlStr = "SELECT * FROM Z USER FUN WHERE user_id ="+user id.ToString() 
+" AND fun user id="+uid; 
DB db = new DB0; 
return (db.GetDataRow(sqlStr)!=null); 
} 
public void listen(string uid)// 收 听 某 个 用 户 
{ 
string sqlStr = "INSERT INTO Z_ USER FUN(user _id.fun user id) VALUES("+ 
user _id.ToString() + "," + uid+")"; 
DB db = new DBO; 
db.ExecuteSQLNonQuery(sqlStr); 
} 
public void cancelListen(string uid)// 取 消 收听 某 个 用 户 
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string sqlStr = "DELETE FROM Z USER FUN WHERE user_id =" + user idToString0 
+" AND fun user id=" + uid; 

DB db = new DB0; 

db.ExecuteSQLNonQuery(sqlStr); 


} 
public void postMsg(string strMsg)// 发 表 新 消息 
Í 
string sqlStr = "INSERT INTO Z MESSAGE(user id,msg content,reply_count,post_time) 
VALUES(" + 
user _id.ToString() + "," + strMsg + ",0,"+ DateTime.Now.ToString() +"')"; 
DB db = new DBO; 
db.ExecuteSQLNonQuery(sqlStr); 
) 
public void modifyO/ 个 人 信息 维护 
{ 


List<SqlParameter> sqlParams = new List<SqlParameter>(); 
string sqlStr = "UPDATE Z USER SET user name = 
@name,user_sex=@sex ,user_email=(@email " 
+ 
"user address=(@address ,user_info=(@info,user_telephone=(@telephone ,user_birthday=(@birthday " 

+ "user photo=(@user photo WHERE user id=" + user_id.ToString(): 
sqlParams.Add(new SqlParameter("(@name", user name)); 
sqlParams.Add(new SqlParameter("(@sex", user_sex)); 
sqlParams.Add(new SqlParameter("@email", user _email)); 
sqlParams.Add(new SqlParameter("@address", user_address)); 
sqlParams.Add(new SqlParameter("@info", user_ info)): 
sqlParams.Add(new SqlParameter("(@telephone", user_telephone)); 
if (user birthday.Year =1) 

sqlParams.Add(new SqlParameter("@birthday", DBNull.Value)); 
else 

sqlParams.Add(new SqlParameter("@birthday", user_birthday)); 
if(user photo==null) 

sqlParams.Add(new SqlParameter("@user_photo",DBNull. Value)); 
else 

sqlParams.Add(new SqlParameter("@user_photo",user_photo)); 
DB db = new DBO; 
db.ExecuteSQLNonQuery WithParam(sqlStr.sqlParams); 


2. 消息 实体 类 Zmessage.cs 类 


在 App_Code 目录 中 添加 新 的 类 文件 Zmessage.cs。 在 该 类 中 添加 操作 Z MESSAGE 
表 对 应 的 自动 属性 已 经 错误 反馈 属性 errorMsg。 相 应 的 代码 如 下 : 


public int msg_id í get; set; } 
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public int user_id í get; set; } 

public string msg_content í get; set; } 

public int reply_count { get; set; } 

public DateTime post time í get; set; } 

public string errorMsg { get; set; } // 用 于 存放 错误 消息 


与 消息 相关 的 操作 主要 有 如 下 几 个 。 
e 获取 消息 , 包括 获取 所 有 用 户 的 消息 、 获 取 指 定 用 户 的 消息 和 获取 登录 用 户 及 其 收 
听 用 户 的 消息 。 
e 删除 自己 的 消息 。 
e 转播 或 评论 消息 。 
e 获取 某 消息 的 所 有 转播 或 评论 记录 。 
相应 方法 的 实现 如 下 所 示 : 
public DataTable getTopMsg0// 获 取 最 新 消息 ， 供 未 登录 用 户 查看 
{ 


string sqlStr = "SELECT TOP 20 [msg _id],[msg_content], [user name], 
[user login].[post time], [reply_count] FROM [Z MESSAGE],[Z_USER] WHERE 
Z_MESSAGE.user_id = Z_USER.user_id ORDER BY msg id DESC"; 
DB db = new DBO; 
return db.GetDataTable(sqlStr); 
} 
public DataTable getUserAndOtherMsg(string user_id)// 登 录用 户 以 及 其 收听 的 用 户 发 表 的 消息 
{ 
string sqlStr = "SELECT TOP 20 [msg id],[msg_content], [user name], 
[user login].[post time], [reply_count] FROM [Z MESSAGE],[Z_ USER] WHERE 
Z MESSAGE.user id=Z USER.user id AND (Z MESSAGE.user id=" + user_id +" OR 
Z MESSAGE.user id IN (SELECT fun user id FROM Z USER FUN WHERE user_id =" + user_id + 
"ORDER BY msg id DESC"; 
DB db = new DBO; 
return db.GetDataTable(sqlStr); 
) 
public Data Table getUserMsg(string user_id)// 指 定 用 户 的 消息 
Í 
string sqlStr = "SELECT TOP 20 [msg _id].[msg_content], [user name].[user_login], 
[post_time], [reply_count] FROM [Z MESSAGE].[Z USER] WHERE Z MESSAGE.user id = 
Z _USER.user id AND Z MESSAGE.user id=" + user id +" ORDER BY msg_id DESC"; 
DB db = new DBO; 


return db.GetDataTable(sqlStr); 
} 
public bool delMsg(string msgId, string userId)// 删 除 自己 发 表 的 消息 
í 

bool ret = true; 


string sqlStr = "SELECT * FROM [Z MESSAGE] WHERE user_id = " + userId +" AND 
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msg id=" + msegld; 


} 


DB db = new DBO: 
DataRow dr = db.GetDataRow(sqlStr); 
if (dr = null) 
d 
errorMsg = "您 不 能 删除 别人 的 消息 ": 
return false; 
} 
// 先 删除 Z_REPLY 表 中 的 对 应 评论 ， 然 后 删除 Z_MESSAGE 表 
db.BeginTrans(); 
try 
{ 
sqlStr= "DELETE FROM [Z REPLY] WHERE msg_id =" + msgld; 
db.ExecuteSQLNonQuery(sqlStr); 
sqlStr= "DELETE FROM [Z MESSAGE] WHERE msg_id =" + msgId; 
db.ExecuteSQLNonQuery(sqlStr); 
} 
catch (Exception e) 
{ 
errorMsg = e.Message; 
db.Rollback():; 
ret = false; 
} 
finally 
{ 
db.close0; 


) 
return ret; 


public void replyMsg(string uid,string msgId.string strMsg)// 转 播 或 评论 消息 


{ 


string sqlStr = "SELECT user id FROM Z MESSAGE WHERE msg id =" + msgld: 
DB db = new DBO: 
DataRow dr = db.GetDataRow(sqlStr); 
string srcUserId = dr["user_id"].ToString0; 
db.open(); 
db.BeginTrans(); 
try 
{// 先 插入 Z_REPLY 表 ， 然 后 更 新 Z_ MESSAGE 表 中 的 reply_count 字段 
sqlStr = "INSERT INTO 


Z REPLY(msg id,reply_user id.src_User id,reply_content,reply_time) VALUES(" + 


msgld + "," + uid + "," + srcUserId +","+strMsg+","+ 


DateTime.Now.ToString() + ")"; 


db.ExecuteSQLNonQuery WithTran(sqlStr):; 
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sqlStr = "UPDATE Z MESSAGE SET reply_count = reply_count+1 WHERE 
msg id=" + msgld; 
db.ExecuteSQLNonQueryWithTran(sqlStr); 


db.Commit(); 
} 
catch (Exception e) 
d 
db.Rollback(); 
} 
finally 
{ 
db.close0; 
) 
} 
public DataTable getReply(string msgId)// 获 取消 息 的 所 有 转播 和 评论 记录 
{ 


string sqlStr = "SELECT [reply_content], [user_name],[reply_time] FROM 
Z REPLY,Z USER WHERE msg_id =" + 
msgld+ "AND Z REPLY .reply user id=Z USER.user id UNION "+ 
"SELECT msg content AS reply_content, user_name,post_time AS reply_time 
FROM Z MESSAGE.Z_USER " + 
" WHERE msg_id=" + msgld +" AND Z MESSAGE.user id = Z_USER.user_id 
ORDER BY reply_time DESC"; 
DB db = new DB0: 
return db.GetDataTable(sqlStr); 
} 


12.2.3 ”设计 母 版 页 


为 了 使 网 站 的 所 有 页 面 都 具有 相同 的 布局 风格 和 外 观 ， 需 要 添加 母 版 页 ， 然 后 基于 该 
母 版 页 创建 其 他 页 面 。 

新 建 母 版 页 ， 名 称 为 MasterPage.master。 在 母 版 页 中 有 两 个 ContentPlaceHolder 控件 ， 
一 个 位 于 <head> 标 记 中 ， 一 个 位 于 <form> 中 。 删 除 <head> 标 记 中 的 <title> 标 记 ， 这 样 ， 在 
内 容 页 中 可 以 设置 每 个 内 容 页 的 标题 信息 。 

1. 页 面 设计 


首先 创建 一 个 样式 表 文 件 ， 并 在 母 版 页 中 引入 该 样式 表 文 件 ， 所 有 的 内 容 页 都 可 以 应 
该 样式 表 文件 中 的 样式 定义 。 
本 例 中 新 建 的 样式 表 文 件 名 为 StyleSheet.css， 内 容 如 下 : 


。356 ASPNET 4.0 网 站 开发 实例 教程 


background-color: #f3f3f3; 
) 

img 

d 


overflow: auto; 


} 
hl 


$ 
color: #808000; 


) 
#left, #right 


í 


background-color: #eeeeee; 
border: 1px solid #C0C0C0: 
height: 500px; 

) 

#left 


i 

width: 240px; 
float: left; 
height: 400px; 
} 


在 母 版 页 的 <head> 标 记 中 添加 如 下 代码 引入 该 样式 表 文 件 : 
<link href="StyleSheet.css" rel="stylesheet" type="text/css" /> 


整个 网 站 的 布局 设置 为 头 部 、 中 间 内 容 区 域 和 页 尾部 分 。 母 版 页 中 需要 设计 的 是 头 部 
和 尾部 ， 中 部 保留 ContentPlaceHolder 控件 不 变 即 可 。 首 先 ， 添 加 一 个 <table> 通 过 1 个 图 
片 来 显示 网 站 的 标题 图 片 ， 代 码 如 下 : 


<table width=800 border="0" cellspacing="0" cellpadding="0" > 
<tr> 
<td width="100%"><img src="images/bg.jpg" width="100%" height="180" 
/></td> 
</t> 
</table> 


接 下 来 ， 添 加 两 个 Panel 控件 ， 分 别 用 于 显示 未 登录 用 户 的 快速 登录 和 登录 用 户 的 欢 
迎 信 息 。 这 两 个 Panel 控件 在 同一 时 刻 将 只 有 一 个 可 见 ， 代 码 如 下 : 


<asp:Panel ID="Panell" runat="server" Height="50px" Width="100%"> 
<table width="100%" style="background-color:#f0f0f0;" border="0" cellpadding="0" 
cellspacing="0"> 
<tr> 
<td style="height: 37px; font-weight: bolder; color: #800080;" align="left"> 
<div><a hre 人 "Index.aspx"> 首 页 </a></div> 
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</td> 
<td align="right" width="80%" style="height: 25px"> 
<div> 
<asp:Label ID="lblInfo" runat="server" Text=" 用 户 名 " 
Width="122px"></asp:Label> 
<asp:TextBox ID="userLogin" runat="server" Width="80px" 
></asp:TextBox>&nbsp; 
<asp:Label ID="Label1" runat="server" Text=" 密 码 " 
Width="42px"></asp:Label> 
<asp:TextBox ID="userPwd" runat="server" Width="80px" 
TextMode="Password"></asp:TextBox>&nbsp; 
<asp:Button ID="btnLogin" runat="server" Text=" 登 录 " Width="80px" 
OnClick="btnLogin Click" />&nbsp; 
<a href="Register.aspx"> 注 册 </a></div> 
</td> 
</tr> 
</table> 
</asp:Panel> 
<asp:Panel ID="Panel2" runat="server" Height="50px" Width="100%"> 
<table width="100%" style="background-color:#f5f5f5;" border="0" cellpadding="0" 
cellspacing="0"> 
<tr> 
<td style="height: 37px; font-weight: bolder; color: #800080;" align="left"> 
<div><a href="Index.aspx"> 我 的 首页 </a></div> 
</td> 
<td align="right"><%= Session["user name"] %> 欢迎 您 的 光临 <a 
href="Search.aspx"> 找 人 </a></td> 
<A> 
</table> 
</asp:Panel> 


在 </form> 结 束 标记 的 上 方 ， 添 加 页 尾部 分 ， 代 码 如 下 : 
<div> 
<hr > 


<table width="100%" border="0" cellspacing="0" cellpadding="0" 
style="background-color:#f0f0f0;"> 


<tr> 
<td align="center" width="0%"> 版 权 所 有 (C) 金 百合 迷你 微 博 2012</td> 
<A> 
</table> 


</div> 


ad 
Ea: 


ContentPlaceHolderl 中 不 要 添加 任何 代码 ， 这 是 为 内 容 页 预 留 的 占 位 符 。 
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2. 后 台 代码 

在 母 版 页 的 后 台 代码 中 需要 实现 如 下 功能 : 加 载 页 面 时 ， 根 据 用 户 当 前 是 否 登 录 显示 
或 隐藏 相应 的 Panel 控件 ， 实 现 用 户 的 快速 登录 功能 ;登录 成 功 后 ， 将 用 户 信息 保存 至 
Session 变量 中 。 代 码 如 下 : 


protected void Page Load(object sender, EventArgs e) 


í 
if (Session["user login"] = nulD)/ 如 果 用 户 没有 登录 
{// 显 示 Panell, Baj Panel2 
Panell.Visible = true; 
Panel2.Visible = false; 
} 
else 
{// 登 录 成 功 隐藏 Panell， 显 示 Panel2 
Panell.Visible = false; 
Panel2.Visible = true; 
} 
protected void btnLogin_ Click(object sender, EventArgs e) 
{ 


Zuser user = new Zuser(): 
if (user.login(userLogin.Text, userPwd.Text)) 
{// 设 置 Session; 
Session["user_ login"] = userLogin.Text; 
Session["user id"] = user.user id; 
Session["user name"] = user.user name; 
Session["user"] = user; 
Panel2. Visible = true; 
Panell.Visible = false; 
Response.Redirect(Request.Path + "?" + Request.QueryString); 


else 


Page.ClientScript.RegisterClientScriptBlock(this.GetType(), "warning", 
"alert(\""+user.errorMsg+"\");", true); 
) 
} 


至 此 ， 完 成 母 版 页 的 设计 ， 后 面 创建 的 所 有 页 面 都 是 基于 此 母 版 页 的 。 


12.2.4 首页 


网 站 的 首页 为 Index.aspx， 在 该 页 面 中 将 显示 最 新 的 用 户 消息 以 及 登录 用 户 的 相关 信息 。 
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1. 页 面 总 体 设 计 
在 ContentPlaceHolderID="head" 的 Content 控件 中 ， 添 加 <title> 标 记 ， 代 码 如 下 : 


<asp:Content ID="Content1" ContentPlaceHolderID="head" Runat="Server"> 
<title> 我 的 首页 </title> 
</asp:Content> 


由 于 该 页 需要 多 次 后 台 交 互 ， 所 以 设计 为 异步 刷新 ， 在 内 容 区 域 中 首先 添加 
ScriptManager 和 UpdatePanel 控件 。 后 面 添 加 的 控件 都 放置 在 UpdatePanel 控件 内 。 

该 页 面 通过 两 个 <div> 来 进行 布局 ， 一 个 id 为 left， 一 个 id 为 right， 左 边 的 <div> 包 含 
一 个 Panel 控件 ， 用 于 显示 登录 用 户 的 相关 信息 ; 右边 的 <div> 包 含 一 个 MultiView 控件 ， 
该 MultiView 控件 中 包含 两 个 View 控件 , 其 中 View1 包含 两 个 Panel 控件 , 一 个 用 于 发 表 
新 消息 , 一 个 用 于 显示 已 发 表 的 消息 ,View2 用 于 显示 用 户 的 听众 或 用 户 收听 的 用 户 列表 。 
在 “ 源 ” 视 图 中 ， 可 以 看 到 页 面 的 代码 层次 结构 如 图 12-2 所 示 。 


日 <asp:Cortent ID="Content2" ContentPlaceHolderID=“ContentPlaceHolder1” R 
<asp:ScriptManager ID="ScriptManagerl” runat="server"> 
</asp:ScriptManager> 

<asp:UpdatePanel ID="UpdatePanell” runat="server">) 


Kdiv id="left”> 


IE right > 
<asp:MultiView ID="MultiViewl” runat="server"> 
<asp:View ID="Viewl” runat="server"> 


Kasp:Par 
</asp:View> 
</asp:MultiView> 
diy> 
</ContentTenplate> 
</asp:UpdatePane1> 
</asp:Content> 


div 


View2” runat="server") 


图 12-2 首页 的 代码 层次 结构 


2. 左 侧 <div> 设 计 


id 为 left 的 左 侧 <div> 包 含 Panell 控件 ， 该 控件 中 的 设计 和 布局 类 似 于 第 5 章 中 的 例 
5-7 中 的 Panel2， 相 应 的 源 代 码 如 下 : 


<asp:Panel ID="Panell" runat="server"> 
<table class="style1" border="1" cellpadding="1"> 
<tr align="center"> 
<td colspan="3"> 
<asp:Image ID="Image1" runat="server" ImageUrl="~/images/boy.gif" /> 
<asp:HyperLink ID="HyperLink1" runat="server" 
NavigateUrl="~/Modify.aspx"> 维 护 个 人 信息 </asp:HyperLink> 
</td> 
</tr> 
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"></asp:Label> 
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<tr align="center"> 
<td> 收 听 </td> 
<td> 听 众 </td> 
<td> 信 息 </td> 
</tr> 
<tr align="center"> 
<td> 
<asp:LinkButton ID="LinkButtonOther" runat="server" Text="Other" 
onclick="LinkButtonOther_Click"></asp:LinkButton> 
</td> 
<td> 
<asp:LinkButton ID="LinkButtonFun" runat="server" Text="Fun" 
onclick="LinkButtonFun_Click"></asp:LinkButton> 
</td> 
<td> 
<asp:LinkButton ID="LinkButtonMsg" runat="server" Text="Msg" 
onclick="LinkButtonMsg_Click"></asp:LinkButton> 
</td> 
<tr> 
<tr> 
<td align="center"> kE #</td> 
<td colspan="2"> 
<asp:Label ID="LabelName" runat="server" Text="" ></asp:Label> 
</td> 
</tr> 
<tr> 
<td align="center">Email</td> 
<td colspan="2"> 
<asp:Label ID="LabelEmail" runat="server" Text=" "></asp:Label> 
</td> 
</t> 
<tr> 
<td align="center"> 所 在 地 </td> 
<td colspan="2"> 
<asp:Label ID="LabelAddress" runat="server" Text=" "></asp:Label> 
</td> 
<A> 
<tr> 
<td align="center"> 电 话 </td> 
<td colspan="2"> 
<asp:Label ID="LabelTelephone" runat="server" Text=" 


</td> 
</tr> 


第 12 章 简易 微 博 系统 “361。 


<tr> 
<td align="center"> A fij 4r</td> 
<td colspan="2"> 
<asp:Label ID="LabelInfo" runat="server" 
Text="LabelInfo"></asp:Label> 
</td> 
</tr> 
</table> 
</asp:Panel> 


3. 右 侧 <div> 中 的 View1 设计 


Viewl 中 包含 两 个 Panel 控件 ， Panel2 和 Panel3 。 其 中 ，Panel2 包含 一 个 文本 框 、 
个 按钮 和 一 个 提示 信息 用 的 Label 控件 ， 相 应 的 代码 如 下 : 


<asp:Panel ID="Panel2" runat="server"> 
<asp:TextBox ID="TextBoxMsg" runat="server" Height="65px" TextMode="MultiLine" 
Width="453px"></asp:TextBox> 
<asp:Button ID="ButtonPost" runat="server" 
Text=" 发 表 " onclick="ButtonPost Click" style="height: 21px" /><br /> 
<asp:Label ID="LabelMsg" runat="server" Text="Label"></asp:Label> 
</asp:Panel> 


Panel3 中 包含 一 个 ListView 控件 , 该 控件 用 于 显示 Z_MESSAGE 表 中 的 消息 , 根据 场 
景 不 同 , 可 能 显示 的 内 容 也 不 同 (分 别 对 应 Zmessage 类 中 的 getTopMsg、getUserAndOtherMsg 
和 getUserMsg 方法 返回 的 数据 )。 这 里 的 ListView 控件 选择 为 “项 目 符合 列表 ”布局 方式 ， 
数据 源 需要 通过 后 台 编 码 指定 ， 在 “ 源 ” 视 图 中 需要 手动 编辑 控件 的 < AlternatingItem- 
Template> 和 < ItemTemplate> 模 板 ， 通 过 Eval 方式 绑 定 数据 集中 的 字段 ， 相 应 的 代码 如 下 ; 


<asp:ListView ID="ListView1" runat="server" DataSourceID="SqlDataSourcel" > 
<AlternatingltemTemplate> 
<li style="background-color: #FFF8DC:"> 
<asp:Label ID="userameLabel" runat="server" Text='<%# Eval("user name") %>' />: 
<asp:Label ID="msg_contentLabel" runat="server" 
Text='<%# Eval("msg_content") %>' /> 


<br/> 发 表 时 间 : 
<asp:Label ID= "post timeLabel" runat="server" Text=<%# Eval("post_time") %>' /> 
<br/> 评论 次 数 : 


<asp:Label ID="reply_countLabel" runat="server" 
Text='<%# Eval("reply_count") %>' /> 
<asp:LinkButton ID="replyHyper" runat="server" CommandArgument='<%# 
Eval("msg_id") %>' Visible='<%# Session["user id"]!=null %>' OnClick="replyMsg" Text=" 转 播 " /> 
<asp:LinkButton ID="delLinkButton" runat="server" CommandArgument='<%# 
Eval("msg 1d") %>' Visible='<%# Session["user login"]!=null && Session["user login"].ToString( = 
Eval("user_login").ToString() %>' OnClick="delMsg" Text=" 删 除 " /> 
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<br ><br > 
<i> 
</AlternatingItemTemplate> 
<EmptyDataTemplate> 
没有 任何 消息 。 
</EmptyDataTemplate> 
<ItemTemplate> 


<li style="background-color: #DCDCDC;color: #000000;"> 


<asp:Label ID="uameLabel" runat="server" Text="<%# Eval("user_name") %>' />: 
<asp:Label ID="msg_contentLabel" runat="server" 
Text='<%# Eval("msg_content") %>' /> 
<br/> 发 表 时 间 : 
<asp:Label ID="post timeLabel" runat="server" Text='<%# Eval("post time") %> /> 
<br/> 评论 次 数 : 
<asp:Label ID="reply_countLabel" runat="server" 
Text='<%# Eval("reply_count") %>' /> 
<asp:LinkButton ID="replyHyper" runat="server" CommandArgument='<%# 


Eval("msg_id") %>' Visible='<%# Session["user_id"]!=null %>' OnClick="replyMsg" Text=" 转 播 " /> 


<asp:LinkButton ID="delLinkButton" runat="server" CommandArgument='<%# 


Eval("msg_id") %>' Visible='<%# Session["user_login"]!=null && Session["user login"].ToString() == 


Eval("user login").ToString() %>' OnClick="delMsg" Text=" 删 除 " /> 
<br /><br /> 
<Ni> 
</ItemTemplate> 
<LayoutTemplate> 
<ul ID="itemPlaceholderContainer" runat="server" 


style="font-family: Verdana, Arial, Helvetica, sans-serif;"> 


<li runat="server" id="itemPlaceholder" /> 
</ul> 


<div style="text-align: center:background-color: #CCCCCC:font-family: Verdana, 


Arial, Helvetica, sans-serif:color: #000000;"> 
</div> 
</LayoutTemplate> 
</asp:ListView> 


4. 右 侧 <div> 中 的 View2 设计 


View2 中 包含 一 个 ListView 控件 ， 该 控件 用 于 显示 用 户 收 听 的 用 户 列表 或 者 用 户 的 听 
众 列 表 ( 分 别 对 应 Zuser 类 中 的 getUserOther 和 getUserFun 方法 返回 的 数据 ), 这 个 ListView 
控件 选择 为 “ 平 铺 ”布局 方式 ， 数 据 源 需要 通过 后 台 编 码 指定 ， 在 “ 源 ” 视 图 中 需要 手动 


编辑 控件 的 < AltematingItemTemplate> 和 < ItemTemplate> 模 板 ， 通 过 Eval 方式 绑 定 数据 集 


中 的 字段 ， 相 应 的 代码 如 下 : 


bi 
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<asp:ListView ID="ListView2" runat="server" DataSourceID="SqlDataSource2" 
DataKeyNames="user_id" GroupltemCount="3"> 
<AlternatingltemTemplate> 
<td runat="server" style="background-color: #FFFFFF;color: #284775;"> 
<asp:Image ID="Image2" runat="server" ImageUrl='<%# Eval("photo_path") %>' 这 
<br > 
<asp:LinkButton ID="Button1" runat="server" Text=<%# Eval("user name") %>' 
OnClick="ShowUser" CommandArgument='<%# Eval("user id") %>' />( 
<asp:Label ID="user login" runat="server" Text='<%# Eval("user login") %>' />) 
<br/> 所 在 地 : 
<asp:Label ID="user addressLabel" runat="server" 
Text='<%# Eval("user_address") %>' /> 
<br/> # R: 
<asp:Label ID="birthday" runat="server" Text='<%# Eval("user birthday") %>' /> 
</td> 
</AlternatingItemTemplate> 
<EmptyDataTemplate> 
<table runat="server" 
style="background-color: #FFFFFF;border-collapse: collapse;border-color: 
#999999:;border-style:none;border-width: 1px;"> 
<tr><td> 未 返回 数据 。</td> 
</tr> 
</table> 
</EmptyDataTemplate> 
<GroupTemplate> 
<tr ID="itemPlaceholderContainer" runat="server"> 
<td ID="itemPlaceholder" runat="server"> </td> 
<A> 
</GroupTemplate> 
<ItemTemplate> 
<td runat="server" style="background-color: #E0FFFF:color: #333333;"> 
<asp:Image ID="Image2" runat="server" ImageUrl='<%# Eval("photo_path") %>' /> 
<br/> 
<asp:LinkButton ID="Button1" runat="server" Text=<%# Eval("user_name") %>' 
OnClick="ShowUser" CommandArgument='<%# Eval("user_id") %>' />( 
<asp:Label ID="Label2" runat="server" Text='<%# Eval("user login") %>' />) 


<br/> 所 在 地 : 
<asp:Label ID="Label4" runat="server" Text='<%# Eval("user_address") %>' /> 
<br/> ZEEL 
<asp:Label ID="Label5" runat="server" Text=<%# Eval("user birthday") %>' /> 
</td> 
</ItemTemplate> 
<LayoutTemplate> 


<table runat="server"> 
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<tr runat="server"> 
<td runat="server"> 
<table ID="groupPlaceholderContainer" runat="server" border="1" 
style="background-color: #FFFFFF;border-collapse: 
collapse;border-color: #999999:border-style:none;border-width: 1px;font-family: Verdana, Arial, Helvetica, 
sans-serif;"> 
<tr ID="groupPlaceholder" runat="server"> 
</tr> 
</table> 
</td> 
</tr> 
<tr runat="server"> 
<td runat="server" 
style="text-align: center;background-color: #SD7B9D:font-family: 
Verdana, Arial, Helvetica, sans-serif:color: #FFFFFF"> 
</td> 
</tr> 
</table> 
</LayoutTemplate> 
</asp:ListView> 


说 明 : 
Image 控件 的 ImageUrl 属性 绑 定 的 数据 集 字段 是 photo_path， 该 字段 是 通过 后 台 的 
SELECT 语句 用 AS 方法 重 命名 的 输出 列 , 详 见 Zuser 类 的 getUserOther 和 getUserFun 方法 。 


5. 后 台 代码 


当 页 面 加 载 时 , 需要 根据 用 户 是 否 登 录 来 隐藏 需要 的 Panel 控件 , Page Load 方法 的 代 
码 如 下 : 


protected void Page_Load(object sender, EventArgs e) 
{ 
LabelMsg.Visible = false; 
if (!Page.IsPostBack) 
{ 
MultiView1.ActiveViewIndex = 0; 
if (Session["user_login"] == nulD)/ 如 果 用 户 没 有 登录 
{// 隐 藏 Panell， 显 示 最 新 消息 
Panell.Visible = false; 
Panel2.Visible = false; 


b 


else 
showPanell(Session["user login"].ToStringO): 
showMsg(); 
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) 

private void showMsgO/ 显 示 消 息 
Zmessage msg = new Zmessage(); 
ListView1.DataSourceID 
if (Session["user login"] 一 nulD)/ 如 果 是 匿名 用 户 ， 显 示 最 新 消息 
í 


ListView1.DataSource = msg.getTopMsg(); 
ListView1.DataBind(); 


else 


Panel2.Visible = true; 
ListView1.DataSource = msg.getUserAndOtherMsg(Session["user_id"].ToString()); 
ListView1.DataBindO:; 


} 
private void showPanell(string userLogin)//Panell 中 加 载 登 录用 户 信息 
{ 
Panell.Visible = true; 
Zuser user = (Zuser)Session["user"]; 
LabelName.Text = user.user name; 
LabelEmail.Text = user.user_email; 
LabelAddress.Text = user.user_address: 
LabelInfo.Text = user.user_info; 
LabelTelephone.Text =user.user_telephone; 
LinkButtonOther. Text = user.getOther(user.user id); 
LinkButtonFun.Text = user.getFun(user.user_id); 
LinkButtonMsg.Text = user.getMsg(user.user_id); 
JImagel.ImageUrl = "~/touxiang.aspx?userid=" + user.user_id.ToString(); 


说 明 : 
头像 的 显示 与 第 5 章 所 讲 的 方法 类 似 ， 也 是 借助 touxiang.aspx 页 面 进行 加 载 并 显示 。 
本 节 将 会 介绍 该 页 面 的 具体 实现 。 


对 于 登录 成 功 的 用 户 , 个 人 信息 中 的 3 个 LinkButton 分 别 对 应 用 户 收听 、 听众 和 消息 。 
需要 的 Click 事件 处 理 程序 如 下 : 


protected void LinkButtonOther_Click(object sender, EventArgs e) 
i 
MultiView1.ActiveViewIndex = 1://View2 可 见 
ListView2.DataSourceID = ""; 
Zuser user = new Zuser(); 
ListView2.DataSource = user.getUserOther(Session["user id"] ToString0); 
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ListView2.DataBind(); 
} 
protected void LinkButtonFun_Click(object sender, EventArgs e) 
{ 
MultiViewl.ActiveViewIndex = 1://View2 可 见 
ListView2.DataSourceID = ""; 
Zuser user = new Zuser(); 
ListView2.DataSource = user.getUserFun(Session["user id"].ToStringO); 
ListView2.DataBind(); 
} 
protected void LinkButtonMsg_Click(object sender, EventArgs e) 
{ 
MultiView1.ActiveViewIndex = 0://View1 可 见 
Zmessage msg = new Zmessage(); 
ListView1.DataSource = msg.getUserMsg(Session["user_id"].ToStringO); 
ListView1.DataBind():; 
Panel2.Visible = true; 
} 


对 于 登录 用 户 ， 还 可 以 发 表 新 消息 、 转 播 已 有 消息 和 删除 自己 的 某 条 消息 ， 需 要 的 代 
码 如 下 : 


protected void ButtonPost_Click(object sender, EventArgs e) 
{ 
if (TextBoxMsg.Text.Length > 140) 
{ 
LabelMsg.Text=" 消 息 长 度 最 大 为 140"; 
LabelMsg.Visible = true; 
return; 
} 
if (TextBoxMsg.Text.Length 一 0) 
{ 
LabelMsg.Text = "请 输入 消息 内 容 "; 
LabelMsg.Visible = true; 
return; 
} 
Zuser user = (Zuser)Session["user"]; 
user.postMsg(TextBoxMsg.Text); 
TextBoxMsg.Text = ""; 
showMse0; 
) 
protected void replyMsg(object sender, EventArgs e) 
{ 
LinkButton lb = (LinkButton)sender; 
string msgId = lb.CommandArgument; 
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string strUrl = "Reply.aspx?msgld="+msgId+"&userld="+Session["user id"].ToString(); 


Response.Redirect(strUrl): 

} 

protected void delMsg(object sender, EventArgs e) 

{ 
LinkButton lb = (LinkButton)sender; 
string msgId = ]b.CommandArgument: 
Zmessage msg = new Zmessage(); 
msg.delMsg(msgId,Session["user_id"].ToString0); 
showMsg0; 

) 


技巧 : 

上 述 代码 中 通过 LinkButton 的 CommandArgument 属性 传递 了 参数 ,该 参数 在 ListView 
控件 中 是 通过 Eval 方式 绑 定 的 数据 集中 的 字段 msg id. 

当 右 侧 View2 控件 可 见 时 ，ListView2 控件 显示 了 用 户 收 听 或 听众 信息 ， 单 击 某 个 用 
户 ， 可 跳 转 到 相应 的 “个 人 资料 ”页 面 ， 代 码 如 下 : 


protected void ShowUser(object sender, EventArgs e) 


{ 
LinkButton lb = (LinkButton)sender: 
string userId = lb.CommandArgument:; 
string strUrl = "UserInfo.aspx?userId=" + userId; 
Response.Redirect(strUrl); 
} 


6. 显示 头像 辅助 页 touxiang.aspx 


通过 “添加 新 项 ”对 话 框 添加 touxiang.aspx 页 面 ， 需 要 注意 的 是 ， 这 个 页 面 不 要 使 用 
母 版 页 。 在 页 面 的 Load 事件 中 ,根据 请 求 中 的 QueryString 集合 获取 用 户 ID， 然 后 判断 是 
否 有 专属 头像 ， 如 果 没 有 则 根据 性 别 显 示 系 统 默 认 头 像 ，Page_Load 方法 的 代码 如 下 : 


protected void Page_Load(object sender, EventArgs e) 
t 
Zuser user = new Zuser(); 
byte[] data = user.getPhotoById(Request.QueryString["userid"].ToString0); 
if (data = null) 
{ 
string fileName = Request.PhysicalApplicationPath + "/images/girl.gif"; 
if (user.user_sex = "1 ") 
fileName = Request.PhysicalApplicationPath + "/images/boy.gif"; 
FileStream fs = new FileStream(fileName,FileMode.Open); 
data = new byte[fs.Length+1]; 
fs.Read(data, 0, (int)fs.Length); 
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Response.ContentType = "image/gif"; 
Response.OutputStream. Write(data, 0, data.Length); 
3 


至 此 ， 完 成 首页 面 的 全 部 功能 ， 等 全 部 页 面 创建 完成 后 ,将 统一 测试 页 面 的 运行 效果 
12.2.5 ”注册 页 面 


注册 页 面 Register.aspx 比较 简单 ， 只 需 提 供用 户 注 册 所 需 的 表单 即 可 。 
1. 页 面 设 计 
在 ContentPlaceHolderID="head" 的 Content 控件 中 ， 添 加 <title> 标 记 ， 代 码 如 下 : 


<asp:Content ID="Content2" ContentPlaceHolderID="head" Runat="Server"> 
<title> 注 册 微 博 新 用 户 </title> 


</asp:Content> 


在 内 容 区 域 添 加 注册 表单 ， 与 第 5 章 中 的 例 5-6 类 似 ， 页 面 布局 如 图 12-3 所 示 。 


 ContantPlaceHolder1 (站 十 又) E 
注册 新 用 户 
登录 名 登录 名 不 能 为 空 
密码 请 输入 密码 
确认 密码 两 次 输入 密码 不 一 致 
真实 姓名 请 输入 真实 姓名 
性 别 en cx 
个 人 微 博 地 址 UL | 个 人 微 博 地 址 不 能 为 空 
[E-mail LU | 
地 址 WU | 
个 人 介绍 
zi 
a| wa] 


图 12-3 注册 页 面 的 设计 视图 


后 台 代 码 
是 交 ” 按 钮 的 单 击 事件 处 理 程序 如 下 : 


protected void ButtonSubmit Click(object sender, EventArgs e) 
{ 
Zuser user = new Zuser(); 
if (user.checkLogin(TextBoxLogin.Text.Trim())) 
Í 
Page.ClientScript. RegisterClientScriptBlock(this.GetType(), "success", "alert(\" 该 登 
录 名 已 存在 \"); ", true); 
return; 
} 
if (user.checkUrl(TextBoxHomeUrl.Text)) 


{ 
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Page.ClientScript.RegisterClientScriptBlock(this.GetType(), "success", "alert\" 个 人 
微 博 地 址 已 被 使 用 \"); ", true); 
return; 


} 

user.user name = TextBoxName.Text: 

user.user login = TextBoxLogin.Text; 

user.user password = TextBoxPassword.Text; 

User.User sex = RadioButtonList1.SelectedValue; 

user.home url = TextBoxHomeUrlLText: 

user.user email = TextBoxEmail.Text; 

user.user info = TextBoxInfo.Text; 

user.user address = TextBoxAddress.Text; 

user.regist_time = DateTime.Now; 

bool result = user.register(); 

1f (result) 

í 
user.login(TextBoxLogin.Text,TextBoxPassword.Text); 
Session["user login"] = TextBoxLogin.Text; 
Session["user id"] = useruser id; 
Session["user"] = user; 
Response.Redirect("Index.aspx"); 


1226 ”查找 用 户 页 面 


查找 用 户 页 面 Search.aspx 用 于 根据 姓名 和 所 在 地 进行 模糊 查询 , 查找 自己 感 兴趣 的 用 
户 ， 从 而 进行 收听 等 操作 。 

1. 页 面 设计 

在 ContentPlaceHolderID="head" 的 Content 控件 中 ， 添 加 <title> 标 记 ， 代 码 如 下 : 


<asp:Content ID="Content1" ContentPlaceHolderID="head" Runat="Server"> 
<title> 我 要 找 人 </title> 
</asp:Content> 


内 容 区 域 中 是 一 个 <table>， 表 格 的 前 两 行 是 查询 条 件 ， 第 三 行 是 一 个 ListView 控件 ， 


如 图 12-4 所 示 。ListView 控件 用 于 显示 查询 结果 ， 该 控件 的 设计 与 Index.aspx 页 面 中 的 
ListView2 非常 相似 ， 这 里 不 再 给 出 源 代码 。 


TE [ žaj 


本 x [o] 
( HRPE) HENT ARNT) ( 数据 尾 定 ) 

EE BANK HEE RENT RE 

£B mG 26 MENT $A MAHT 

> E > 

KENT was) RENE MEAT KESE NEMT) 

MEL REHE MER REHE HEL NRHE 

生日 : HERT 生日 : RENT 生日 ; RST 


图 12-4 查找 用 户 页 面 的 设计 视图 
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2. 后 台 代码 


该 页 在 加 载 时 ， 将 默认 显示 所 有 用 户 列表 ， 然 后 判断 用 户 是 否 登 录 ， 如 果 没 有 登录 ， 
则 查询 按钮 不 可 用 。Page_ Load 事件 处 理 函 数 的 代码 如 下 : 


protected void Page Load(object sender, EventArgs e) 
i 
ListView1.DataSourceID = ""; 
Zuser user = new Zuser(); 
ListView1.DataSource = user.searchUser(TextBoxName.Text, TextBoxAddress.Text); 
ListView1.DataBindO; 
if (Session["user id"] == null) 
ButtonSearch.Enabled = false; 
} 


“查询 ”按钮 和 链接 到 每 个 用 户 信息 页 的 LinkButton 按钮 的 Click 事件 处 理 程序 如 下 : 


protected void ButtonSearch_Click(object sender, EventArgs e) 
{ 
if (TextBoxName.Text == "") 
{ 
Page.ClientScript.RegisterClientScriptBlock(this.GetTypeO, "warning", "alert(\" 请 输 
入 姓名 \");", true); 
return; 
} 
ListView1.DataSourceID = ""; 
Zuser user = new Zuser(); 
ListView1.DataSource = user.searchUser(TextBoxName.Text,TextBoxAddress.Text); 
ListView1.DataBind(); 
} 
protected void ShowUser(object sender, EventArgs e) 
{ 
LinkButton lb = (LinkButton)sender: 
string userId = lb.CommandArgument; 
string strUrl = "UserInfo.aspx?userId=" + userId; 
Response.Redirect(strUrl); 


1227 个 人 资料 页 面 

个 人 资料 页 面 UserInfo.aspx 与 Index.aspx 页 面 非常 相似 ， 只 是 该 页 显示 的 不 是 当前 登 
录用 户 的 信息 ， 而 是 查询 出 来 的 某 个 普通 用 户 的 基本 信息 以 及 他 所 发 表 的 消息 。 

1. 页 面 设计 


在 ContentPlaceHolderID="head" 的 Content 控件 中 ， 添 加 <title> 标 记 ， 通 过 Session Æ 
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量 获取 要 显示 的 用 户 姓 名 ， 代 码 如 下 : 
<asp:Content ID="Content1" ContentPlaceHolderID="head" Runat="Server"> 


<title><%= Session["current_name"].ToString() %> 的 个 人 资料 </title> 
</asp:Content> 


内 容 区 域 与 Index.aspx 页 面 非常 相似 ， 也 是 需要 ScriptManager 和 UpdatePanel 控件 ， 
然后 通过 两 个 <div> 来 进行 布局 ， 所 不 同 的 主要 有 如 下 两 点 。 
e° 左 侧 <di 从 中 的 Panel 控件 显示 的 查询 的 某 个 用 户 信息 , 头像 旁边 是 一 个 LinkButton 
控件 ， 根 据 登录 用 户 是 否 收听 了 该 用 户 而 显示 为 “收听 ”或 者 “取消 收听 ”。 
° AM Viewl 控件 中 没有 用 于 发 表 新 消息 的 Panel 控件 ,该 页 中 Viewl 控件 只 用 于 显 
示 指 定 用 户 的 消息 。 
这 里 只 给 出 页 面 的 布局 效果 图 , 如 图 12-5 所 示 , 具体 的 控件 设置 可 参考 Index.aspx 页 面 。 


CortentP'acerioideri ( EFES] 


SeriptWenacer ~ Seriputemager! 
MutiVien1 
View1 
RT: KERT 
AAA: MEHE 
评论 次 数 : HEHE 
收听 | 听众 信息 ° HERE: HERT 
Qher | En lss 发 表 时 间 ; 
姓名 LabelName TEAM RERE 
Email LabelEmai] : 
所 在 地 LabelMddress W 
电 活 LabelTelephone 评论 次 数 : HERE 
个 人 简介 LabelInfo 
BERT: HERE 
REA. MERRE 
View2 
区 È ppa 
A s ) 
E E: BERE 
BRAE ci PERE RERE HERT) 
了 所在地; 92131 jE: Seir A Reie 
| 生日: SERE 生日 : KEHE 生日 


图 12-5 个 人 资料 页 面 的 设计 视图 


后 台 代 码 


在 页 面 的 Load 事件 中 , 通过 QueryString 集合 获取 要 显示 用 户 的 ID， 然 后 将 用 户 的 姓 
名 和 ID 存储 到 Session 变量 中 Session["current_user id"] 和 Session["current name"]， 后 面 
查询 收听 用 户 和 听众 时 ， 将 使 用 这 个 Session 变量 ， 完 整 的 后 台 代码 如 下 : 


protected void Page Load(object sender, EventArgs e) 
{ 
MultiView1.ActiveViewIndex = 0; 
if (Request.QueryString["userId"] 一 nulD)/ 只 显示 指定 用 户 信息 


{ 
/隐藏 Panell， 显 示 最 新 消息 
Panell.Visible = false; 
Panel2.Visible = false; 

} 


else 
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showPanell(RequestQueryString["userId"].ToStringO); 
showMsg(RequestQueryString["userId"].ToStringO); 
Session["current user id"] = RequestQueryString["userId"].ToStringO; 
Zuser u = new Zuser(Int32.Parse(Request.QueryString["userId"].ToString0)); 
Session["current name"] = u.user_name; 
LinkButton1.Visible=(Session["user id"]!=null); 
if (Session["user id"] != null) 
{// 判 断 是 否 已 收听 
Zuser user = new Zuser(Int32.Parse(Session["user_ id"].ToStringO)); 
if (user.hasListen(Request.QueryString["userId"].ToString0)) 
LinkButton1.Text = "取消 收听 "; 
else 
LinkButton1.Text = "收听 "; 


} 

Private void showPanell(string userId) 

{ 
Panell.Visible = true; 
Zuser user = new Zuser(Int32.Parse(userId)); 
LabelName.Text = user.user name; 
LabelEmail.Text = user.user_email; 
LabelAddress.Text = user.user_address: 
LabelInfo.Text = user.user_info; 
LabelTelephone.Text = user.user telephone; 
LinkButtonOther.Text = user.getOther(user.user id); 
LinkButtonFun. Text = user.getFun(user.user_ id); 
LinkButtonMsg.Text = user.getMsg(user.user_id); 
Imagel1.ImageUrl = "~/touxiang.aspx?userid=" + user.user_id.ToString(); 

) 


private void showMsg(string userId) 
{ 
Zmessage msg = new Zmessage(); 
ListView1.DataSourceID = ""; 
Panel2.Visible = true; 
ListView1.DataSource = msg.getUserMsg(userId); 
ListView1.DataBindO: 
} 
protected void LinkButtonMsg_Click(object sender, EventArgs e) 
{ 
MnultiView1.ActiveViewIndex = 0; 
Zmessage msg = new Zmessage(); 
ListView1.DataSource = msg.getUserMsg(Session["current_user_id"].ToString()); 
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ListView1.DataBind0O; 
Panel2.Visible = true; 


} 
protected void LinkButtonOther Click(object sender, EventArgs e) 
i 
MultiView1.ActiveViewIndex = 1; 
ListView2.DataSourceID = ""; 
Zuser user = new Zuser(); 
ListView2.DataSource = user.getUserOther(Session["current_user id"].ToString()); 
ListView2.DataBind(); 
} 
protected void LinkButtonFun Click(object sender, EventArgs e) 
{ 
MultiView1.ActiveViewIndex = 1; 
ListView2.DataSourceID = ""; 
Zuser user = new Zuser(): 
ListView2.DataSource = user.getUserFun(Session["current_user_id"].ToString()); 
ListView2.DataBind(); 
} 
protected void ListenUser(object sender, EventArgs e) 
{ 
if (LinkButton1.Text == "收听 ") 
{ 
Zuser user = new Zuser(Int32.Parse(Session["user_id"].ToString0)); 
user.listen(Session["current_user_id"].ToString0); 
LinkButton1.Text = "取消 收听 "; 
} 
else// 取 消 收 听 
{ 
Zuser user = new Zuser(Int32.Parse(Session["user_id"].ToString0)); 
User.cancelListen(Session["current_ user id"].ToStringO): 
LinkButton1.Text = "收听 ": 
} 
} 
protected void ShowUser(object sender, EventArgs e) 
Í 


LinkButton lb = (LinkButton)sender: 

string userId = Ib.CommandArgument; 

string strUrl = "UserInfo.aspx?userId=" + userId; 
Response.Redirect(strUrl); 
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12.2.8 个 人 信息 维护 页 


个 人 信息 维护 页 面 Modify.aspx 与 第 5 章 的 例 5-8 类 似 , 所 不 同 的 是 这 里 设置 为 异步 刷 
新 ， 后 台 的 数据 库 操作 封装 到 实体 类 中 实现 。 


1. 页 面 设计 


在 ContentPlaceHolderID="head" 的 Content 控件 中 ， 添 加 <title> 标 记 ， 值 为 主题 ， 代 码 
如 下 : 


<asp:Content ID="Content1" ContentPlaceHolderID="head" Runat="Server"> 
<title> 个 人 信息 维护 </title> 
</asp:Content> 


内 容 区 域 中 首先 添加 ScriptManager 和 UpdatePanel 控件 ， 然 后 是 一 个 <table> 表 单 ， 布 
局 如 图 12-6 所 示 。 
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图 12-6 个 人 信息 维护 页 面 的 设计 视图 


后 台 代 码 


在 页 面 的 Load 事件 中 ， 首 先 加 载 用 户 的 信息 进行 显示 ， 当 用 户 修改 了 个 人 信息 后 ， 
单 击 “ 提 交 ” 按 钮 时 ， 后 台 将 进行 密码 校 验 ， 然 后 调用 实体 类 Zuser 的 方法 进行 修改 操作 ， 
完整 的 代码 如 下 : 


protected void Page Load(object sender, EventArgs e) 
{ 


LabelMsg. Visible = false; 
if (!Page.IsPostBack) 
{ 
Calendar1.Visible = false; 
if (Session["user id"] != null) 
ShowInfo0: 
else 
í 
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Response.Redirect("Index.aspx"); 


} 
} 
} 
private void ShowInfo() 
{ 
Zuser user = (Zuser)Session["user"]; 
TextBoxName.Text = user.user_name; 
TextBoxEmail.Text = user.user_email; 
TextBoxAddress.Text = user.user_address; 
TextBoxInfo. Text = user.user_info; 
TextBoxTelephone. Text =user.user_telephone; 
TextBoxBirthday.Text = user.user_birthday.ToString(); 
foreach (ListItem item in RadioButtonListl.Items) 
if (item.Value = user.user_sex) 
item. Selected = true; 
JImagel.ImageUrl = "—/touxiang.aspx?userid=" + user.user_id.ToString(); 
} 
protected void LinkButton1_Click(object sender, EventArgs e) 
{ 
Calendar1.Visible = true; 
} 


protected void Calendar1_SelectionChanged(object sender, EventArgs e) 
{ 
TextBoxBirthday.Text = Calendar1.SelectedDate.ToString(): 
if (!(TextBoxBirthday.Text = "")) 
Calendar1.Visible = false; 


J 
protected void ButtonModify_Click(object sender, EventArgs e) 
Ú 
if (Session["user id"] != null) 
Í 
if (TextBoxName.Text = "") 
{ 
LabelMsg.Text =" 姓 名 不 能 为 空 "; 
LabelMsg.Visible = true; 
retum; 
} 


Zuser user = (Zuser)Session["user"]; 

if (TextBoxPassword.Text == user.user password) 

í 
user.user name = TextBoxName.Text: 
user.user sex = RadioButtonListl.SelectedValue; 
user.user email = TextBoxEmail Text; 
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user.user address = TextBoxAddress.Text; 
user.user info = TextBoxInfo. Text; 
user.user telephone = TextBoxTelephone.Text; 
if (TextBoxBirthday.Text != "") 
user.user birthday = DateTime.Parse(TextBoxBirthday.Text); 
if (FileUpload1.HasFile) 
{ 
byte[] data = new byte[FileUpload1.FileContent.Length + 1]: 
FileUpload1.FileContent.Read(data, 0, 
(int)FileUpload1.FileContent.Length); 
user.user_photo = data; 


; 
user.modify0; 
Session["user"] = user; 
} 
else 
{ 
LabelMsg.Text = "密码 错误 ， 不 允许 修改 "; 
LabelMsg.Visible = true; 
} 
} 
else 
{ 
LabelMsg.Text =" 会 话 已 过 期 ， 请 重新 登录 "; 
LabelMsg.Visible= true; 
Response.Redirect("Index.aspx"); 
) 


12.2.9 转播 和 评论 消息 页 面 


转播 和 评论 消息 页 面 Reply.aspx 将 根据 请 求 参数 显示 指定 消息 和 对 该 消息 的 所 有 评 
论 ， 同 时 ， 上 方 提 供 文本 框 ， 用 户 可 以 输入 转播 评论 进行 再 次 转播 。 
1. 页 面 设 计 
在 ContentPlaceHolderID="head" 的 Content 控件 中 ， 添 加 <title> 标 记 ， 代 码 如 下 : 
<asp:Content ID="Content1" ContentPlaceHolderID="head" Runat="Server"> 
<title> tN </title> 
</asp:Content> 
内 容 区 域 中 首先 添加 ScriptManagerT 和 UpdatePanel 控件 ， 然 后 是 一 个 <table>， 第 一 行 
放置 一 个 Panel 控件 供用 户 输入 新 的 转播 和 评论 内 容 ， 第 二 行 是 一 个 ListView 控件 ， 用 于 
显示 该 消息 的 所 有 转播 和 评论 信息 。<table> 元 素 的 完整 代码 如 下 : 
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<table align="center" width="80%"> 
<tr> 
<td> 
<asp:Panel ID="Panell" runat="server"> 
<asp:TextBox ID="TextBoxMsg" runat="server" Height="65px" 
TextMode="MultiLine" 
Width="512px"></asp:TextBox> 
<asp:Button ID="ButtonReply" runat="server" 
Text=" 转 播 " onclick="ButtonReply_ Click" style="height: 21px" /><br /> 
<asp:Label ID="LabelMsg" runat="server" Text="Label"></asp:Label> 
</asp:Panel> 
</td> 
</tr> 
<tr> 
<td> 
<asp:Panel ID="Panel2" runat="server"> 
<asp:ListView ID="ListView1" runat="server" DataSourcelD="SqlDataSource1"> 
<AlternatingltemTemplate> 
<li style="background-color: #FFF8DC;"> 
<asp:Label ID="una " runat="server" Text=<%# Eval("user_name") %>' />: 
<asp:Label ID="msg_contentLabel" runat="server" 
Text='<%# Eval("reply_content") %>' /> 
<br/> 转播 时 间 : 
<asp:Label ID="post" runat="server" Text="<%# Eval("reply_time") %>' /> 
<br /><br /> 
<i> 
</AlternatingItemTemplate> 
<EmptyDataTemplate> 
没有 任何 消息 。 
</EmptyDataTemplate> 
<ItemTemplate> 
<li style="background-color: #DCDCDC;color: #000000;"> 
<asp:Label ID="una" runat="server" Text=<%# Eval("user name") %>' />: 
<asp:Label ID="msg_contentLabel" runat="server" 
Text='<%# Eval("reply_content") %>' /> 


<br/> 转播 时 间 : 
<asp:Label ID="post" runat="server" Text='<%# Eval("reply_time") %>'/> 
<br /><br /> 
</> 
</ItemTemplate> 
<LayoutTemplate> 


<ul ID="itemPlaceholderContainer" runat="server" 
style="font-family: Verdana, Arial, Helvetica, sans-serif;"> 
<li runat="server" id="itemPlaceholder" /> 
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</ul> 
<div style="text-align: center;background-color: #CCCCCC;font-family: 
Verdana, Arial, Helvetica, sans-serif:color: #000000;"> 
</div> 
</LayoutTemplate> 
</asp:ListView> 
<asp:SqlDataSource ID="SqlDataSource1" runat="server" 
ConnectionString="<%$ ConnectionStrings:WeiBoDb %>" 
SelectCommand="SELECT [reply_content], [user name],[reply_time] FROM 
[Z REPLY].[Z USER] WHERE Z REPLY.src_user id= Z USER.user id"> 
</asp:SqlDataSource> 
</asp:Panel> 
</td> 
</tr> 
</table> 


2. 后 台 代码 


后 台 代码 主要 包括 ， 在 页 面 的 Load 事件 中 ， 加 载 并 显示 该 消息 和 该 消息 的 所 有 转播 
与 评论 信息 ; 单 击 “ 转 播 ” 按 钮 后 ， 调 用 Zmessage 类 的 方法 添加 新 的 评论 记录 ， 并 更 新 
Z_MESSAGE 表 中 该 消息 的 reply_count 字段 。 完 整 的 代码 如 下 : 


protected void Page_Load(object sender, EventArgs e) 


{ 
LabelMsg.Visible = false; 
if (Request.QueryString["msgId"] = null) 
{ 
Response.Redirect("Index.aspx"); 
return; 
) 
Session["msg id"] = Request.QueryString["msgId"] ToStrine(); 
showReply(); 
) 
private void showReplyO 
{ 
ListView1.DataSourceID = ""; 
Zmessage msg = new Zmessage(); 
ListView1.DataSource = msg.getReply(Session["msg_id"].ToStringO): 
ListView1.DataBindO: 
} 
protected void ButtonReply_Click(object sender, EventArgs e) 
{ 


if (TextBoxMsg.Text.Length > 140) 

{ 
LabelMsg.Text = "消息 长 度 最 大 为 140"; 
LabelMsg.Visible = true; 
return; 
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} 
Zmessage msg = new Zmessage(); 


msg.replyMsg(Session["user id"] ToString(),Session["msg_id"] ToString0.TextBoxMsg.Text); 
TextBoxMsg.Text = ""; 
showReply0; 
} 


至 此 ， 已 完成 所 有 的 页 面 设计 ， 接 下 来 将 测试 网 站 ， 查 看 网 站 运行 效果 。 
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本 节 将 运行 网 站 ， 测 试 网 站 的 各 项 功能 ， 查 询 微 博 系统 的 运行 效果 。 
12.3.1 设置 启动 选项 


此 时 的 微 博 系统 包含 多 个 页 面 ， 接 下 来 ， 需 要 设置 一 下 站 点 的 起 始 页 。 

选择 “网 站 ”| “启动 选项 ”命令 , 打开 站 点 的 属性 页 , 在 左 侧 列表 中 选择 “启动 选项 ”， 
然后 从 右 侧 区 域 ， 选 择 “ 特 定 页 ” 单 选 按钮 ， 单 击 右 侧 的 “浏览 ”按钮 ， 打 开 “ 选 择 页 码 
以 开始 ”对 话 框 ， 这 里 选择 Index.aspx 页 面 作为 起 始 页 ， 如 图 12-7 所 示 。 


x] 


已 


图 12-7 设置 站 点 的 起 始 页 
单 击 “ 确 定 ” 按 钮 ， 完 成 起 始 页 的 设置 。 
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编译 并 运行 程序 ， 在 浏览 器 中 打开 网 站 的 首页 ， 此 时 用 户 尚未 登录 ， 将 显示 系统 中 最 
新 发 表 的 消息 ， 如 图 12-8 所 示 。 
单 击 “ 注 册 ” 链 接 可 导航 到 注册 页 面 ， 进 行 新 用 户 的 注册 ， 如 图 12-9 所 示 。 
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K 12-8 微 博 系统 首页 图 12-9 注册 新 用 户 页 面 


注册 成 功 后 ， 将 进行 自动 登录 并 跳 转 到 首页 ， 将 显示 用 户 信息 和 用 户 默认 看 到 的 微 博 
消息 ， 如 图 12-10 所 示 。 
此 时 ， 可 以 通过 右上 角 的 “ 找 人 ”链接 ， 查 找 感 兴趣 的 用 户 进行 收听 ,， 如 图 12-11 所 示 。 


图 12-11 找 和 人 页面 


单 击 用 户 列表 中 的 用 户 名 链接 ， 可 进入 该 用 户 的 个 人 资料 页 面 ， 该 页 显示 了 该 用 户 收 
听 、 听 众 和 发 表 的 消息 等 信息 ， 如 图 12-12 所 示 。 

单 击 “ 收 听 ” 按 钮 ， 可 收听 该 用 户 。 收 听 后 ， 相 应 的 按钮 将 变 为 “取消 收听 ”， 单 击 
“我 的 首页 ”返回 主页 面 ， 可 以 看 到 收听 数 发 生 了 变化 ， 右 侧 窗口 也 显示 了 收听 用 户 发 表 
的 微 博 消 息 ， 如 图 12-13 所 示 。 
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图 12-12 个 人 资料 页 面 图 12-13 ”收听 用 户 后 刷新 了 首页 信息 
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单 击 某 条 消息 后 面 的 “转播 ”链接 ， 将 跳 转 到 该 消息 的 转播 页 面 ， 在 此 可 输入 新 的 评 
论 进行 转播 ， 如 图 12-14 所 示 。 

返回 首页 ， 单 击 “ 维 护 个 人 信息 ”链接 ， 可 打开 个 人 信息 维护 页 面 ， 在 此 页 中 ， 可 修 
改 自己 的 信息 ， 上 传 新 的 个 性 头像 ， 如 图 12-15 所 示 。 
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图 12-14 转播 消息 图 12-15 个 人 信息 维护 


系统 的 其 他 功能 这 里 就 不 一 一 列举 了 ， 读 者 可 自行 上 机 验证 。 
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